grafiske elementer i menu, som bavgrund

Tags:    html css

Hej alle sammen.

Jeg er en gammel bruger af udvikleren, med stor erfaring med CSS og HTML.

Jeg er pt i gang med at lave en menu i CSS der har forskelling grafiske menu bavgrunde.

Der er kommet et par ting op for mig som jeg åbenbart ikke helt har forstået.

Jeg har lavet følgende opsætning

<div id="***">(menu blokken)
<div id="***">(menu 1 element)
<a class="***">(selve elementet)</a>
</div>
<div id="***">(menu 2 element)
<a class="*...
</div>

Systemet virker fint lige ind til man prøver at lave en Active ændring, hvor bavgrunden skal være et andet element.

Jeg har over 3 forsøg fået dette system til at virke i henholdvis IE-FF dog ikke samtidig.

(menu blokken) er kun til posisonering.

(menu 1 element) er brugt til float, width, margin, text align.

(selve elementet) har en bavgrund, width, mousover mm..

Er dette en forkert måde at sætte det op på, hvis man arbejder med xhtml/css?

Der er en visning af siden uden active css i brug: http://test.tabzy.dk/selma/screenStyle.html







Indlæg senest redigeret d. 09.03.2009 12:48 af Bruger #7500
Tak til alle der har være inde og kigge på denne problem stilling.

Efter en times søgning og negle bidning. fand jeg frem til følgende news feed der havde løsningen: http://archivist.incutio.com/viewlist/css-discuss/57541

Det hele bundede i display setupet. altså block vs inline.

Ved at lave (selve elementet) til block kunne der laves vide på den og de grafiske elementer blev vist korrekt.

Har du kommentar til selve setuped af div, class, id elementer så kom endeligt med dem.

Edit: yderlige informationer om display http://www.w3schools.com/css/pr_class_display.asp



Indlæg senest redigeret d. 09.03.2009 14:31 af Bruger #7500
Jeg ved godt det er en udfordring men hvis du vil have lidt kritik, kan du kigge lidt på semantikken, men tag det her som noget ekstra, det er fint som det er..

Hvis man tilgår din side uden CSS/Javascript osv, kommer de forskellige emner forkert.

Dine kommer skitseret sådan her:

-Wrapper
--Logo
--Top
---Søg
---Menu
--Billede til side
-Bund
--Relateret undermenu
--Sidens indhold
--Relaterede links
--Citat

Jeg så det hellere:

-Wrapper
--Indhold (Wrapper)
---Billede til side (alt, title = Citat)
---Sidens indhold
---(JS udskrevet)Citat
---Relaterede links
---Relateret undermenu
--Yderligere (Wrapper)
---Info(Wrapper)´
----Logo
----Søg med accessibility mulighed


/J





Indlæg senest redigeret d. 09.03.2009 23:06 af Bruger #5789
Hej Jokke.

Tak for din tilbage melding. Jeg kan godt se problemstillingen og fangede den også da jeg lave en lille test af siden på http://browsershots.org/

Spørsmålet er dog, efter min mening, om det er relevant på små sider. Er ogsætning uden for grafisk browser tolkning, ikke mest set i forhåldt til wap. Hvor man a lige vel laver en separat visning?

Med det sagt, vil det helt sikkert være med i mine overvejelser næste gang jeg lave en template.

Venlig hilsen
Thorbjørn



t