Hjælp til menu

Tags:    html css

<< < 123 > >>
Hej

Jeg har et problem. Er igang med en hjemmeside(www.winzz.frac.dk) og har lavet nogle knapper til menuen.(www.winzz.frac.dk/menu/winzz-knap.png og www.winzz.frac.dk/menu/winzz-knap2.png)

siden er langt fra færdig og har taget det fra et template.

lige nu der det sådan ud i css'en:

#nav a {
background: url(http://www.winzz.frac.dk/menu/winzz-knap.png);
font-weight: bold;
color: #000000;
text-decoration: none;
font-family: tahoma, "times new roman", serif;
display: inline-block;
height: 40px;
weight: 156px;
}

men så kommer knapperne til at se sådan ud: http://img266.imageshack.us/my.php?image=sswinzz3gb7.png

hvad gør jeg? =)



weight: 156px;
Måske er det dette, der er dit problem...
Det hedder jo width... ikke weight.



weight: 156px;
Måske er det dette, der er dit problem...
Det hedder jo width... ikke weight.


ups, min fejl - men det hjalp ikke, der skete ikke noget ved det da jeg ændrede det =/

andre der har nogle idéer til hvad jeg skal gøre? (:



Det kan godt være den måde du skriver dit background-img css på...

I min egen kode har jeg i hvert fald det til at stå sådan her:

background-image: url(uploads/images/grafik/bg-bottom.gif)

Din url er jo en hel rigtig url så at sige...?



Du skal nok prøve at skrive:

background: url(/menu/winzz-knap.png)



Det kan godt være den måde du skriver dit background-img css på...

I min egen kode har jeg i hvert fald det til at stå sådan her:

background-image: url(uploads/images/grafik/bg-bottom.gif)

Din url er jo en hel rigtig url så at sige...?

Har gjort det på denne måde med alle mine billeder på siden, og hvis jeg gør som du siger(/menu/winzz-knap.png), forsvinder knapperne helt. :(




her er hele menuen i min css fil hvis det kan hjælpe:
#nav {
background: url(http://winzz.frac.dk/menulinie.png) repeat-x;
height: 40px;
font-size: 17px;
font-family: arial, "times new roman", serif;
text-align: center;
}
#nav em {
font-size: 22px;
font-style: normal;
font-family: tahoma, "times new roman", serif;
}
#nav ul {
min-width: 780px;
padding-top: 10px;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
display: inline;
}
#nav li {
background: 12px 6px url(http://winzz.frac.dk/menuadskilning.png) no-repeat;
padding-left: 50px;
padding-right: 20px;
margin: 0;
display: inline;
}
#nav li.first {
background: none;
padding-left: 20px;
}
#nav a {
background: url(http://www.winzz.frac.dk/menu/winzz-knap.png);
font-weight: bold;
color: #000000;
text-decoration: none;
font-family: tahoma, "times new roman", serif;
display: inline-block;
height: 40px;
weidth: 156px;

}
#nav a:hover {
color: white;
text-decoration: none;
}

ændrer hoveren når vi har fået de første knapper til at funke



#nav li {
background: 12px 6px url(http://winzz.frac.dk/menuadskilning.png) no-repeat;
padding-left: 50px;
padding-right: 20px;
margin: 0;
display: inline;
}
#nav li.first {
background: none;
padding-left: 20px;
}

Det kan være dine paddings i højre og venstre sider, der driller...
Iøvrigt har du igen skrevet width forkert ;)



Det kan være dine paddings i højre og venstre sider, der driller...
Iøvrigt har du igen skrevet width forkert ;)


det hjalp at rette stave fejlen, men nu ser det sådan her ud: http://img171.imageshack.us/my.php?image=winzzssss9.png

forresten TAK fordi du vil hjælpe mig så meget, er lige startet med at kode og kunne ikke finde ud af at rette denne fejl selv =)



Det er helt okay!
Vi har allesammen været nybegyndere- Og jeg er det stadig - føles det tit som om!

Desuden kunne jeg ikke hjælpe dig med dette, hvis ikke andre i sin tid havde hjulpet mig herinde. Så du må bare hjælpe herinde senere, når DU er eksperten. ;)

Jeg tror stadig det er dine paddings der giver dig problemer...

Prøv evet at smide din HTML-kode herind. Kun den del, der har med din menu at gøre...

Jeg kender heller ikke din li.first... Måske er det også en "driller"...

men først: prøv at sætte dine paddings til 0 og se om der sker noget i RETNING mod det ønskede...



det hjalp! men Andet mangler stadig at komme op.

her er html'en:
<div id="nav">
<ul>
<li class="first"><a href="http://www.winzz.frac.dk"><em>H</em>jem</a></li>
<li><a href="http://www.winzz.frac.dk/om"><em>O</em>m</a></li>
<li><a href="http://www.winzz.frac.dk/portfolio"><em>P</em>ortfolio</a></li>
<li><a href="http://www.winzz.frac.dk/kontakt"><em>K</em>ontakt</a></li>
<li><a href="http://www.winzz.frac.dk/andet"><em>A</em>ndet</a></li>
</ul>
</div>





<< < 123 > >>
t