4 svar · 226 visningar · startad av Troxy
Jag håller på att trixa lite med att bygga en vågrät list-meny.
Frågor:
- Hur får jag bort mellanrummen mellan menyvalen?
- Hur lägger jag en padding på ett menyval? (Så att det blir lite mer blått runt om)
ul li a
{
display:block;
float:left;
padding:3px;
background-color: blue;
}
Använder jag denna kod så försvinner den röda bakgrunden i <ul>-elementet. Detta för att <li>-elementen blir flytande, och flytande element tas bort ur dokumentflödet. Därför tror <ul>-elementet att det är tomt och höjden blir då 0.
Men hur tusan löser jag det problemet då?
Med en clear.
ul:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
ul {display: inline-table;}
/* Hides from IE-mac \*/
* html ul {height: 1%;}
ul {display: block;}
/* End hide from IE-mac */
Källa: http://www.positioniseverything.net/easyclearing.html
Hakar på menyfrågan, då jag håller på att ändra en tabellformatterad horisontell meny, till något i CSS. Menyn ser nu ut i stort som Troxy´s 1:a inlägg, men är centrerad och där jag vill sprida ut knapparna då de bara är fyra.
Undra över hur jag får ett mellanrum mellan knapparna på c:a 25 px och bibehåller centreringen, om jag utgår ifrån Troxy´s grundmodell.
Ha en skön dag! / biggles-1