Den Sat, 11 Aug 2007 06:28:36 +0000 skrev Karl Erik Christensen:
> Den Sat, 11 Aug 2007 00:12:32 +0000 skrev Karl Erik Christensen:
>
>> Den Fri, 10 Aug 2007 23:24:37 +0200 skrev Erik Ginnerskov:
>>
>>> Hej NG
>>>
>>> Jeg sidder og bøvler med at lave en side om vandret menu i en liste. Jeg gik
>>> og troede, at listepunkterne pr. automatik ville blive lige brede. Det kan
>>> jeg bare ikke få dem til at være, de får hver især den bredde, som
>>> linkteksten betinger.
>>>
>>> Hvad er det, jeg har overset?
>>>
>>>
http://hjemmesideskolen.dk/usenet/menutest.asp
>>>
>>> Sætter jeg i css display:block; svarende til sidste kodeboks på siden,
>>> holder menuen op med at være en vandret menu. Det nytter heller ikke at
>>> tilføje !important til breddeangivelsen.
>>>
>>
>> Til inspiration:
>> ginner.css
>
> Mere overskuelig model:
>
> ginner.css
>
> ul#menu {
> list-style-type: none;
> }
>
> ul#menu a:link, ul#menu a:visited {
> color: #000080;
> background: inherit;
> width: 150px;
> display: block;
> text-decoration: none;
> }
>
> ul#menu li {
> float:left;
> margin:0 5px;
> padding: 3px;
> text-align:center;
> }
>
> ul#menu a:hover {
> color: #000;
> background: #ccf;
> }
>
> ginner.html
>
> <html>
> <head>
> <link rel="stylesheet" type="text/css" href="ginner.css">
> <title>test af style</title>
> </head>
> <body>
> <ul id="menu">
> <li><a href="#">Til side 1</a></li>
> <li><a href="#">Til side 2</a></li>
> <li><a href="#">Til side 3</a></li>
> <li><a href="#">Til anden kategori</a></li>
> <li><a href="#">Til en andens side</a></li>
> </ul>
> </body>
> </html>
>
>
Sæt border om li-elementet:
ul#menu li {
float:left;
border-style: solid;
border-width: thin;
border-color: #000;
margin:0 5px;
padding: 3px;
text-align:center;
}
Se eksempel:
http://www.ranunkelvej.com/ginner/test.html
--
Med venlig hilsen
Karl Erik Christensen
www.ranunkelvej.com -
www.ranunkelvej.com/sai/