« 14Dayz blogsearch Pipe | Main | Google Maps - Polylines in IE6 en IE7 »
06 maart 2007
Ul centreren binnen een div:
Ik had een probleem met het centeren van een ul in een div met een vaste breedte:<div class="pages"> <ul> <li></li> <li><a href="/">2</a></li> <li><a href="/">3</a></li> <li class="activePage">4</li> <li><a href="/">5</a></li> <li><a href="/">6</a></li> </ul> </div>met de css:
.browsePagesWrapper div.pages ul { margin: 0; padding: 0; list-style-type: none; }
.browsePagesWrapper div.pages ul li {
margin: 0; padding: 8px 0 0 0;
display: inline; height: 23px;
GEEN FLOAT : LEFT; GEBRUIKEN
font-size: 1em; color: #2E3848;
}
dit kwam omdat de li's binnen deze ul een float left hadden.
Float eruit en het is weer mogelijk om te positioneren binnen de div (de ul float niet meer).
het probleem dat nu ontstaat is dat het niet meer mogelijk is in IE7 een achtergrond te gebruiken voor de "in dit geval" li
met de class "activePage". De oplossing ligt in het verhogen van de line-height. Zo wordt dus ook de li aan de onderkant verlengd/verhoogd
Posted by serge at 06 maart 2007 10:55