Horisontal toppmeny med DIV's

Utvikling og design Webutvikling
1

Som kjent suger jeg i CSS, og nå begynner jeg å forstå at jeg ikke lenger har noe å gjøre bak en pc-skjerm når det kommer til webutvikling… herregud jeg er lei..

Derfor spør jeg en eller annen flink en her:

(Jeg har gjort litt ut av det og greier - tegna utkast av headeren og alt, så jeg håper jeg får svar :wink: )

Hvordan kan jeg lage denne i CSS / div , slik at “Text” er lenker?

http://www.webartikler.com/div_toppmeny.png

Lite oppfinnsomt å skrive “Her er det ikke tekst” - men det skal liksom være et bilde der da… :smiley:

anybody?

2

Du lager en uordnet liste.

[code]


  • Tekst

  • Tekst

  • Tekst

    • <li class="img">Placeholder tekst istedenfor bilde, så bytt ut med css, eller bare legg bildet her.</li>

<li><a href="#">Tekst</a></li>
<li><a href="#">Tekst</a></li>
<li><a href="#">Tekst</a></li>
[/code]

Så styler du den (grusom farge forresten :p), og legger horisontal ved å floate alle liste-elementene. (ul floates så den ikke strekker seg 100%).

[code]ul#menu {
float: left; border: 1px solid #d9d91a; list-style: none; padding: 1px 3px; }

ul#menu li {
background: #d9d91a; float: left; margin: 0 1px; padding: 5px 15px; }

ul#menu li a {
color: #000; text-decoration: none; font-weight: bold; }

ul#menu li.img {
background: #fff; }[/code]

1 Like
3

Sier det samme som i ryktepoenget mitt… Damn, det var raskt og genialt. Takker og bukker!

Ang. den gule fargen, så er den inspirert av oppkastet jeg fikk etter for mange timer med div’er som bare ble jalla. :wink:

  • Den skal ikke være sånn, var bare sånn farge som var valgt da jeg fargela.. :smiley: