FAQ |
Kalender |
![]() |
#1 | ||
|
|||
Nykomling
|
Hej!
Jag begriper inte detta. Jag har en horizontell lista som en meny och en logga bredvid till vänster. Inget konstigt. Så har list-elementet en border-bottom. Nu är det så att den stretchar ut alldeles för långt åt höger så att sidan inte får en fin rak högermarginal. Det beror förmodligen på att jag använt min-width, men om jag inte gör det så blir listan vertikal när fönstret är mindre. Jag har provat sätta border-bottom på loggoelementet i stället men då måste jag sätta z-index på en av dem annars blir antingen loggan eller menyn inte klickbar. Adressfältet nertill har i stort sett samma kod och i stället en border top, men där ser det ut som det ska. Där har jag också använt mig av min-width. Så här ser html-koden ut för menyn: <!-- Menu --> <div class="logo"><a href="index.html"><img src="images/logo.gif" border="0"></a></div> <div class="menu"> <ul> <li><a href="om.html">Om Lefa</a></li> <li><a href="prod.html">Produkter & Tjänster</a></li> <li><a href="kvalitet.html">Kvalitet & Miljö</a></li> <li><a href="kompetens.html">Kompetens</a></li> <li><a href="kontakt.html">Kontakt</a></li> </ul> <br style="clear:both"> </div> Så här ser det ut i den externa css-filen: .logo { position: absolute; background: transparent; margin-bottom: 100px; left: 150px; top: 50px; min-width: 200px; max-width: 300px; padding-bottom: 10px; } .menu ul{ margin-top: 50px; margin-bottom: 100px; padding-top: 0px; padding-left: 450px; position: absolute; text-transform: uppercase; min-width: 800px; max-width: 900px; background: transparent; border-bottom: 1px solid #e68117; } .menu ul li{ display: inline; } .menu ul li a{ float: left; text-decoration: none; color: #B0B0B0; padding: 10.5px 11px; background: transparent; } .menu ul li a:hover{ color: #B0B0B0; text-decoration: underline; } .menu ul li a:visited { color: #B0B0B0; } |
||
![]() |
![]() |
|
|