Lagen css

[anoniem]

Ik heb .gifjes gemaakt met brushes (in gimp) om mijn website een mooiere layout te geven, echter zelfs als ik werk met z-index werken mijn 3 eerste rollover-knoppen niet meer maw: de toepassing van de z-index schijnt niet te werken. Ik weet natuurlijk dat de .gif-laag, gedeeltelijk transparant, over het begin v/h menu komt maar dat zou toch met z-index opgelost moeten zijn? Mogelijke oplossing zou natuurlijk kunnen zijn dat ik het plaatje in 2 stukken snij zodat het niet over de knoppen van het menu komen maar dat is wat omslachtig en veel meer werk.....de z-index is toch bedoeld om lagen over elkaar te plaatsen? Wie heeft er ervaring mee?

[anoniem]

Zonder online voorbeeld is het gokken wat er fout gaat. Als je auto niet rijdt en je geeft aan te hebben getankt, kan het ook nog vanalles mis zijn. Wel gaan talloze beginners aan de slag met z-index, terwijl 1) z-index bijna nooit nodig is en 2) er veel meer kennis voor nodig is dan slechts wat Dreamweaver-knopjes gebruiken. Waarschijnlijk kun je het probleem veel mooier oplossen met minder afbeeldingen en de afbeeldingen die je dan gebruikt, instellen als background van het betreffende element, maar nogmaals, zonder online voorbeeld is het gokken.

[anoniem]

Voor jouw informatie: ik gebruik geen dreamweaver, wel html en css in notepad [quote:c230761559]Waarschijnlijk kun je het probleem veel mooier oplossen met minder afbeeldingen en de afbeeldingen die je dan gebruikt, instellen als background van het betreffende element, maar nogmaals, zonder online voorbeeld is het gokken.[/quote:c230761559] Minder afbeeldingen? Het is net de bedoeling een afbeelding toe te voegen. Neen, ik kan de afbeelding niet gebruiken als achtergrond aangezien er al 2 achtergronden ingesteld zijn waar de afbeelding over moet komen/aan toegevoegd worden. Een online voorbeeld kan ik niet geven want een website online zetten waarvan de eerste 3 knoppen niet werken vind ik niet kunnen. Wat ik wel kan is het werkende voorbeeld (zonder de bedoelde afbeelding) laten zien maar ik betwijfel of je dan de bedoeling wel zou begrijpen. Een poging: body, header en menu (rolloverknoppen) waar de gedeeltelijk transparante afbeelding over komt te liggen in de hoek linksboven.

[anoniem]

[quote="Quicky"]Voor jouw informatie: ik gebruik geen dreamweaver, wel html en css in notepad [quote:5b9f503103] Een online voorbeeld kan ik niet geven want een website online zetten waarvan de eerste 3 knoppen niet werken vind ik niet kunnen. [/quote:5b9f503103] Je kan toch een voorbeeld in een testmap op de server zetten? [/b]

[anoniem]

Nog ff een kleine duit in het zakje, z-index werkt alleen op gepositioneerde elementen. Een test siteje kan je rustig in een test-map zetten als dan kan je er ook nog wel voor zorgen dat het niet wordt geïndexeerd door google ed ([url=http://www.robotstxt.org/meta.html]<meta name="robots" content="noindex" />[/url], of zo: [url=http://en.wikipedia.org/wiki/Noindex]link[/url]).

[anoniem]

[quote:d50078390c] z-index werkt alleen op gepositioneerde elementen[/quote:d50078390c] Dat weet ik; het body-element is bijgevolg relatief en de afbeeldingen die moeten toegevoegd worden staan absoluut..... De testmap staat erop hier: [url] http://www.lingerieannemarie.be/test/ [/url] Zoals jullie kunnen zien werken enkel de 3 laatste knoppen van het menu omdat de bloemen linksboven (het transparante gedeelte) over de 3 eerste knoppen liggen.... Opgelet: de links onder de werkende knoppen heb ik niet aangepast, die werken in deze test dus niet...

[anoniem]

Wat je nu wil bereiken kan volgens mij simpelweg niet. De afbeelding die je over de knoppen wil laten zien (roodw.gif) vangt de events op, in dit geval :hover. De enige manier om dat goed te krijgen is om de knoppen óver de afbeelding heen te laten gaan, maar als ik het goed begrijp wil je dat niet. Hoe dan ook, je kan niet én de afbeelding over de knoppen laten staan én de knoppen laten werken. Overigens zal een oplossing met JavaScript hiervoor ook niet werken, om exact dezelfde reden. [b:dd350569fe]Edit:[/b:dd350569fe] Is er een speciale reden voor het feit dat je roodw.gif niet verwerkt in de achtergrondafbeelding? Dat zou een oplossing kunnen zijn. - Bas

[anoniem]

[quote:65078ade32="Quicky"][quote:65078ade32] z-index werkt alleen op gepositioneerde elementen[/quote:65078ade32] Dat weet ik; het body-element is bijgevolg relatief en de afbeeldingen die moeten toegevoegd worden staan absoluut.....[/quote:65078ade32] :wink: Als je het weet waarom doe je het dan niet?:[code:1:65078ade32]div#cssrollovers { width: 600px; height: 50px; margin: 0 auto 1em auto; z-index: 20; }[/code:1:65078ade32]

[anoniem]

[quote:e9370aa989]De enige manier om dat goed te krijgen is om de knoppen óver de afbeelding heen te laten gaan, maar als ik het goed begrijp wil je dat niet. [/quote:e9370aa989] Dat was nu net wel de bedoeling :wink: [quote:e9370aa989]Is er een speciale reden voor het feit dat je roodw.gif niet verwerkt in de achtergrondafbeelding? Dat zou een oplossing kunnen zijn.[/quote:e9370aa989] neen bedoeling is dat roodw.gif bovenop de achtergrond én de header+container komt te liggen....ook voor later als ik eventueel de afbeeldingen wil vervangen in andere kleuren of andere brushes... [quote:e9370aa989] Als je het weet waarom doe je het dan niet?:[/quote:e9370aa989] Omdat ik niet precies wist welke code v/d rollovers de positioning moest krijgen. thx! Hartelijk dank voor jullie hulp, het is opgelost! :lol:

[anoniem]

[quote:1d2c2808d0="Quicky"]Omdat ik niet precies wist welke code v/d rollovers de positioning moest krijgen. thx! Hartelijk dank voor jullie hulp, het is opgelost! :lol:[/quote:1d2c2808d0]Ieder element dat je een z-index meegeeft moet je ook positioneren. Graag gedaan en veel plezier met je bh's en slipjes, :P

[anoniem]

[quote:953d6e3ad0]Graag gedaan en veel plezier met je bh's en slipjes[/quote:953d6e3ad0] Dankjewel Nieuw probleempje, dit keer met de css....(is het oké om hier verder te gaan, moderator?) Ik heb in een afgeronde container/content 2 knoppen toegevoegd bij de al bestaande knoppen (lees: links) Ik heb dus nieuwe divs aangemaakt rond deze lijsten maar helaas, ik krijg ze niet alleen even hoog uitgelijnd maar IE verknoeit het nog wat verder door een extra gekleurde zijlijn toe te voegen zodat mijn afgeronde hoeken nu een lelijke lijn hebben.....ik weet dat het te maken heeft met de hoogte van een van de divs maar ik weet nie welke..... Een testmap: [url]http://www.lingerieannemarie.be/test/Galleries/indexgalleries.html[/url]

[anoniem]

Ik heb niet helemaal je css enzo door genomen maar waarschijnlijk is het handigste om een css regel toe te voegen alleen voor IE6. Dat kan het mooiste via conditionele comments. Die doe je bijvoorbeeld zo:[code:1:a84d2d7bd0]<!--[if IE 6]> <style type="text/css"> css regels alleen bedoeld voor ie6 </style> <![endif]-->[/code:1:a84d2d7bd0]Je kunt ook een externe stylescheet maken alleen voor IE6 daar verwijs je dan naar tussen de conditionele comments. Het werkt trouwens ook met IE7 IE5 enz, zie [url=http://www.quirksmode.org/css/condcom.html]deze link[/url] voor meer info. Een andere optie is een css hack, er zijn er voor zo ongeveer iedere browser in bestaan, [url=http://centricle.com/ref/css/filters/]link[/url]