Op deze website gebruiken we cookies om content en advertenties te personaliseren, om functies voor social media te bieden en om ons websiteverkeer te analyseren. Ook delen we informatie over uw gebruik van onze site met onze partners voor social media, adverteren en analyse. Deze partners kunnen deze gegevens combineren met andere informatie die u aan ze heeft verstrekt of die ze hebben verzameld op basis van uw gebruik van hun services. Meer informatie.

Akkoord

Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

CSS Vertical-align:middle wilt niet

Ger
4 antwoorden
  • Hey,
    Ik zit een proberen een website te maken, daar heb ik onder andere dit: [code:1:d7ceb84c58]<ul>
    <li id="home"><a class="menu" href="index.php">Home</a></li>
    <li id="nieuws"><a class="menu" href="nieuws.php">Nieuws</a></li>
    <li id="workshops"><a class="menu" href="workshops.php">Workshops</a></li>
    <li id="info"><a class="menu" href="info.php">Info</a></li>
    </ul>[/code:1:d7ceb84c58]
    met bijbehorende css (een beetje ingekort voor de leesbaarheid):
    [code:1:d7ceb84c58]
    ul {
    /*Menubalk*/
    background-image:url(images/menubg.png);
    list-style:none;
    height:40px;
    width:800px;
    clear:both;
    }
    a.menu{
    /*menu items*/
    float:left;
    color:#660000;
    vertical-align:middle;

    height:40px;
    width:130px;

    }
    a.menu:hover{
    background-color:#663333;
    color:FFFFFF;

    }
    [/code:1:d7ceb84c58]

    1 probleem:
    vertical-align:middle doet helemaal niets: mijn links verschijnen nog steeds bovenaan de menubalk. Ik zou jullie graag een voorbeeld geven maar helaas is mijn webserver uit de lucht :(
  • Waarom geef je elke link in die ul een class 'menu' mee i.p.v. die ul een class 'menu' mee te geven?

    Verder; een anchor is een inline element, maar je behandelt het alsof het een block-level element is. Je kunt het wel floaten en afmetingen geven, maar alleen als je 'm weergeeft als een block-level element. Het zal dan naar links floaten binnen de li. Wil je niet gewoon de li naar links floaten?

    Ik zou de regelhoogte aanpassen.
  • Beetje late reactie, maar beter laat dan nooit.

    [quote:fd1d036302="sanchises"]
    *knip*
    1 probleem:
    vertical-align:middle doet helemaal niets: mijn links verschijnen nog steeds bovenaan de menubalk. Ik zou jullie graag een voorbeeld geven maar helaas is mijn webserver uit de lucht :([/quote:fd1d036302]

    Dat komt omdat vertical-align voor geen ene moer werkt voor het positioneren van dingen.

    Als je je elementje verticaal wilt centreren gebruik je:

    [code:1:fd1d036302]
    top:50%;
    margin: -20px;
    [/code:1:fd1d036302]

    en die -20px is dan de helft van de grootte van het elementje wat je verticaal wilt centreren
  • @DerkB:
    1) vertical-align werkt wel degelijk, nl. in tabelcellen.
    2) Heb je jouw tip al eens zelf geprobeerd? Jouw tip werkt niet.

Beantwoord deze vraag

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.