Hoe kan ik op een HTML-pagina met twee div's de boven- en onderkant van de pagina ronde hoeken geven?

Question

Het liefst zou ik dit willen doen met behulp van CSS. Toegevoegd na 1 minuut: (is volgens mij ook de enige mogelijkheid).

rose · Accepted Answer

De meeste moderne browsers ondersteunen CSS3, dat de eigenschap border-radius kent om ronde hoeken mee te maken:

.rounded-corners {
     -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

Dit werkt niet in oudere browsers, maar voor de meeste browsers is dat geen probleem, die houden zichzelf min of meer up to date, of sporen de gebruiker aan om te updaten.

Voor IE8 en ouder kun je gebruik maken van een hack:

Eerst dit downloaden en op je site zetten:

http://code.google.com/p/curved-corner/

Vervolgens in CSS dit gebruiken:

.rounded-corners {
    behavior: url(/css/border-radius.htc);
    border-radius: 20px;
}

Voor ouder Opera's is er een round corner generator:

http://a.deveria.com/roundgen/

(ik voeg ook de bron van funkeydogz even toe)

Hoe kan ik op een HTML-pagina met twee div's de boven- en onderkant van de pagina ronde hoeken geven?

Weet jij het antwoord?

Reacties

Het beste antwoord

Reacties

Inloggen

Stel zelf een vraag