/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Problem med vertical-align
Fra : Brian Bendtsen


Dato : 20-02-07 09:13

Hej

Jeg er ved at lave en menu med en unordered list:

<ul>
<li>Menu punkt 1</li>
<li>Menu punkt 1</li>
<li>Menu punkt 1</li>
<li>Menu punkt 1</li>
</ul>

min css ser således ud:

ul {
list-style: none;
padding-left: 0px;
margin-left: 0px;
}

li {
height: 32px;
width: 130px;
text-indent: 5px;
background-image: url('../images/bg_leftmenu.gif');
}

Hvordan får jeg menupunkterne til at stå i midten vertikalt? Jeg har
prøvet at tilføje "vertical-align: middle;" til li tagget, men det har
ingen effekt.

Link: http://granly.mentor-it.dk/index.php?id=5

mvh. Brian Bendtsen



 
 
Jørgen Farum Jensen (20-02-2007)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 20-02-07 14:55

Brian Bendtsen skrev:

> Hvordan får jeg menupunkterne til at stå i midten vertikalt? Jeg har
> prøvet at tilføje "vertical-align: middle;" til li tagget, men det har
> ingen effekt.
>
> Link: http://granly.mentor-it.dk/index.php?id=5

Din menu ser aldeles ikke ud som
du beskriver den, men har formen

<ul>
<li><a href="url">Menupunkt 1</a></li>
....
</ul>

Og det er jo en helt anden snak - og iøvrigt et
godt eksempel på, at et link til siden er meget
bedre end noget kode i meddelelsen . Den undladelses-
synd gør du dig ikke skyldig i, heldigvis).

Så det er a-elementet du skal formatere:
a {
display:block;
width: 130px;
height: 32px;
line-height:100%;
margin:5px 0;
padding:8px;
}

eller noget i den retning. Under alle omstændigheder
er det lettest at positionere teksten i a-elementet
ved at give dette den fornødne padding (som bestemmer
størrelsen af a-elementet) og margin (som bestemmer
afstanden mellem a-elementerne;

BTW er det en meget dårlig ide at neutralisere
fokustilstanden fra dine links - os der helst vil
bruge tastaturet har ikke en jordisk chance.

Din kode er i øvrigt smækfyldt med fejl, så det
var måske en god ide at validere den først af alt:
http://validator.w3.org
--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Brian Bendtsen (20-02-2007)
Kommentar
Fra : Brian Bendtsen


Dato : 20-02-07 15:13

Jørgen Farum Jensen skrev:
> Din menu ser aldeles ikke ud som
> du beskriver den, men har formen
>
> <ul>
> <li><a href="url">Menupunkt 1</a></li>
> ...
> </ul>
>
> Og det er jo en helt anden snak - og iøvrigt et
> godt eksempel på, at et link til siden er meget
> bedre end noget kode i meddelelsen . Den undladelses-
> synd gør du dig ikke skyldig i, heldigvis).
>
> Så det er a-elementet du skal formatere:
> a {
> display:block;
> width: 130px;
> height: 32px;
> line-height:100%;
> margin:5px 0;
> padding:8px;
> }
>
> eller noget i den retning. Under alle omstændigheder
> er det lettest at positionere teksten i a-elementet
> ved at give dette den fornødne padding (som bestemmer
> størrelsen af a-elementet) og margin (som bestemmer afstanden mellem
> a-elementerne;
>
> BTW er det en meget dårlig ide at neutralisere
> fokustilstanden fra dine links - os der helst vil
> bruge tastaturet har ikke en jordisk chance.
>
> Din kode er i øvrigt smækfyldt med fejl, så det
> var måske en god ide at validere den først af alt:
> http://validator.w3.org

Takker for dit svar.

Mht validering, så er det flashanimationen der skaber de fleste fejl og
det ser lidt voldsomt ud, men jeg aner ikke hvordan jeg skal slippe af
med dem. Et tip eller 2 her er meget velkomment.

En af de andre sider validere skam fint:
http://granly.mentor-it.dk/index.php?id=11

/Brian Bendtsen

Jørgen Farum Jensen (20-02-2007)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 20-02-07 17:44

Brian Bendtsen skrev:

> Mht validering, så er det flashanimationen der skaber de fleste fejl og
> det ser lidt voldsomt ud, men jeg aner ikke hvordan jeg skal slippe af
> med dem. Et tip eller 2 her er meget velkomment.
>

Lad være med at bruge Flash. Du kan sagtens vise de
billeder som et slidehow uden at bruge Flash.

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408849
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste