[css] Lijsten: tekst in midden uitlijnen - Softwareontwikkeling

donderdag 21 juli 2005 17:34

Acties:

Verwijderd

Topicstarter

Hallo,
Ik heb een lijst gemaakt als volgt:

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
body {
    background-color: #FFFFFF;
}
-->
</style></head>

<body>
<div class="menu_CC">
<ul>
            <li>Bedrijfsprofiel</li>
            <li>onze diensten</li>
            <li>Onze producten</li>
            <li>Ons werk</li>
          </ul>
</div>
</body>
</html>

Daarnaast heb ik een stylesheet met de volgende dingen erin:

Cascading Stylesheet:

h1 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: bold;
}
body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    background-color: #E32130;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}.menu_CC {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #000000;
    text-transform: uppercase;
    padding-right: 8px;
}
ul {
    padding-right: 6px
}
li {
    list-style-image: url(Images/bullet.gif);
    list-style-position: outside;
    text-align:right;
    direction: rtl;
}

Nu komt het er als volgt uit te zien:

Afbeeldingslocatie: http://www.bedigital.nl/test.gif

Nu wil ik eigenlijk dat de tekst mooi in het midden (verticaal in het midden dus) wordt uitgelijnt zodat die precies op dezelfde hoogte als de bolletjes komt te staan.
Weet iemand hoe ik dit kan doen?
Alvast bedankt!

donderdag 21 juli 2005 17:40

Acties:

Verwijderd

padding van die li aanpassen

waarom die direction btw? en waarom niet korter margin: 0 in de body selector?

edit: ik snap die rtl, zou het eerder met een achtergrondplaatje doen though
had je niet verder kunnen gaan in je andere topic?

[ Voor 40% gewijzigd door Verwijderd op 21-07-2005 17:45 ]

donderdag 21 juli 2005 17:47

Acties:

crisp

Devver

Pixelated

list-style-image is erg lastig qua positionering, en verschillende browsers gaan er ook anders mee om. Ik gebruik daarom net als mophor meestal een background-image en zet de list-style op none.

Intentionally left blank

donderdag 21 juli 2005 17:47

Acties:

disjfa

be

Of de line-height.

disjfa - disj·fa (meneer)
disjfa.nl