Afrunding

alistapart.com har denne artikel om nettop det: http://www.alistapart.com/articles/customcorners/ Den er dog på engelsk

adam
Køb en zebra - og kald den plet

Grunden til min tanke om afrundede hjørner var at jeg engang da jeg chattede 16/7/329 snakkede jeg med en der nævnte noget med en lille ting der afrundede et hørne hvor efterfølgene tal bestemte hvor meget!?

... I CSS?... arh, det tror jeg ikk'
Du kunne evt. lave et serverside script (jeg tænker på PHP i dette tilfælde), der tegner en tabel + 8 stykker grafik (4 hjørner og 4 sider), og sætter disse grafik-elementer ind i tabellen. Det kunne gøres forholdsvist simpelt, men den anden metode jeg beskrev er aligevel meget mere praktisk.
Linket givet af Adam beskriver hvordan det kunne gøres.

Grunden til min tanke om afrundede hjørner var at jeg engang da jeg chattede 16/7/329 snakkede jeg med en der nævnte noget med en lille ting der afrundede et hørne hvor efterfølgene tal bestemte hvor meget!?

... I CSS?... arh, det tror jeg ikk'
Du kunne evt. lave et serverside script (jeg tænker på PHP i dette tilfælde), der tegner en tabel + 8 stykker grafik (4 hjørner og 4 sider), og sætter disse grafik-elementer ind i tabellen. Det kunne gøres forholdsvist simpelt, men den anden metode jeg beskrev er aligevel meget mere praktisk.
Linket givet af Adam beskriver hvordan det kunne gøres.

Fra CSS 3 bliver det muligt at definere runde hjørner på elementer, læs mere her http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-border-radius

og se et en test side her: http://www.w3.org/Style/Examples/007/roundshadow1.html (virker ikke i de fleste browsere, pga. CSS3 stadig kun er under udvikling)


For at lave runde hjørner har jeg selv gjort brug af 2 tekniker. Den ene er der et billede i hvert hjørne, den anden er der et billede i hvert hjørne + billede ved hver side.

Se eksempler på begge her http://dybber.dk/teknologi

hjørnerne på menuen er lavet med den først nævnte teknik og kanten rundt om "hovedfeltet" er lavet med den anden.


Hilsen

Martin Dybdal (Dybber)

Mozilla/Firefox har denne style
-moz-border-radius:5pt 5pt;

men den virker kun i mozilla og firefox indlysende nok.

-----------------------------------------------------------------------------

Min side ->www.the-hive.dk/~donp/

Nej det kan man desværre ikke lige sådan uden videre.
Man bliver nød til at lave en tabel på 3x3 felter, hvor de 2 yderste, den nederste og den øverste række, bruges til at fastsætte boxens kant. I de yderste celler sætter du så nogle afrundede hjørner i form af grafik, lavet i paint eller photoshop.

... Du får da vidst spurgt om nogle ting idag, hva.

[Redigeret d. 10/05-05 21:02:34 af Simon Jensen]

Den 10-05-05 20:59 skrev Simon Jensen følgende:
-----------------------------------------------------------------------------
Nej det kan man desværre ikke lige sådan uden videre.
Man bliver nød til at lave en tabel på 3x3 felter, hvor de 2 yderste, den nederste og den øverste række, bruges til at fastsætte boxens kant. I de yderste celler sætter du så nogle afrundede hjørner i form af grafik, lavet i paint eller photoshop.

... Du får da vidst spurgt om nogle ting idag, hva.

[Redigeret d. 10/05-05 21:02:34 af Simon Jensen]
-----------------------------------------------------------------------------

Ja hehe
Grunden til min tanke om afrundede hjørner var at jeg engang da jeg chattede 16/7/329 snakkede jeg med en der nævnte noget med en lille ting der afrundede et hørne hvor efterfølgene tal bestemte hvor meget!?

Mozilla/Firefox har denne style
-moz-border-radius:5pt 5pt;

men den virker kun i mozilla og firefox indlysende nok.

-----------------------------------------------------------------------------

Min side ->www.the-hive.dk/~donp/

og:
border-radius til safari, omniweb og nogle få andre.
Det er den rigtige CSS ting.