Héél klein CSS probleemje..maar waar zit het:)
Een tijdje geleden heb ik deze template gedownload:
http://www.templatemo.com/preview/templatemo_311_pink_business
Zoals je in IE, CHROME en FIREFOX ziet..toont hij alles prima..
Maar toch zit er in de winrar package een fout.. Als je de bestanden upload naar de server zie je dat in IE het menu onder elkaar getoond..
Het zit hem hier:
#templatemo_menu {
clear: both;
width: 880px;
height: 45px;
padding: 0 60px;
background: url(images/H-menu.png) no-repeat;
list-style: none;
}
#templatemo_menu ul {
margin: 0;
padding: 0;
list-style: none;
}
#templatemo_menu ul li {
padding: 0;
margin: 0;
display: inline-block;
Ik heb alles al verwijderd uit de stylesheet en in de html code om (behalve het menu) om te kijken of het ergens anders doorkomt..Maar het menu bleef onder elkaar..dus het ligt echt aan dit gedeelte.
Hopelijk weet iemand het!
Alvast bedankt!!
Sonny van de Berg
Cheers
Volgens mij zitten er wat foutjes in, zoals display: inline-block, het is of inline of block, niet allebei tegelijk.
Verder heb je 2 keer list-style:none vermeld, 1 keer bij je ul is voldoende.
Gewijzigd op 18/07/2011 19:02:24 door John Acid
John Acid op 18/07/2011 18:59:12:
Heb je je css al gevalideerd?
Volgens mij zitten er wat foutjes in, zoals display: inline-block, het is of inline of block, niet allebei tegelijk.
Volgens mij zitten er wat foutjes in, zoals display: inline-block, het is of inline of block, niet allebei tegelijk.
Werk je nog met IE 6 of 7?
http://www.quirksmode.org/css/display.html
Gewijzigd op 18/07/2011 19:21:10 door John Acid
Heb nu dit:
#templatemo_menu {
clear: both;
width: 880px;
height: 45px;
padding: 0 60px;
background: url(images/templatemo_menu.png) no-repeat;
display:inline-block;
}
#templatemo_menu ul {
margin: 0;
padding: 0;
display:inline-block;
}
#templatemo_menu ul li {
padding: 0;
margin: 0;
display: inline-block;
}
#templatemo_menu ul li a {
float: left;
display: block;
font-size: 14px;
width: 110px;
height: 35px;
padding: 10px 0 0 0;
color: #666;
text-decoration: none;
font-weight: bold;
text-align: center;
outline: none;
display:inline-block;
}
Toevoeging op 18/07/2011 19:32:28:
Ik ben weer te voorbarig:)
Heb bij elke gedeelte: Display:inline; neergezet. En dit was het gewoon:)
Wat betekend het nu precies dan?
Groeten!
Die schijnen nml display:inline-block te negeren.
Toevoeging op 18/07/2011 19:50:22:
Ik kom alleen een beetje tegenstrijdige informatie tegen als het om ie7 gaat.
Sommige zeggen dat alleen ie6 dit heeft, anderen zeggen dat ook ie7 dit heeft.
Gewijzigd op 18/07/2011 19:47:41 door John Acid
Haal overal de display: inline-block; weg. En zet bij #templatemo_menu ul li float: left; neer. Zelfde effect alleen dan op een veel betere en goede manier.
Maar hij is nu prima. Foutje van Flashmo dus:)
Als je inline aan die menu buttons geeft geef je er eigenlijk mee aan dat het in 1 regel staat en de ul die eromheen staat is dan je alinea. Dit klopt natuurlijk voor geen meter, aangezien je menu bestaat uit losse items.