Avatar billede mik28 Seniormester
11. oktober 2011 - 09:00 Der er 11 kommentarer og
1 løsning

runde hjørner

Hej Eksperter

Jeg tænkte jeg ville lave en js function som kan lægge runde hjørner på f.x en tabel. Ind til videre er jeg kommet her til

<script type="text/javascript">

function hjorner_bund(){
var bredestart=550;
var bredeslut =530;
var i=0;
var u=bredestart-bredeslut;
for (i=0;i<=u;i++)
{
bredestart=bredestart-1;
document.write("<div style='text-align:center;width:"+bredestart+"px;background-color:#aaaaaa;height:1px'></div>");
}
}
</script>

Mit første problem er at <div>ene ikke bliver centeret og mit andet problem er at hjørnerne jo ikke er runde men afskåret
Avatar billede keysersoze Ekspert
11. oktober 2011 - 09:37 #1
runde hjørner kræver enten brug af billeder eller CSS ikke alle browsere forstår (se fx http://www.css3.info/preview/rounded-border/).
Avatar billede niklask Nybegynder
11. oktober 2011 - 09:39 #2
Det kan laves i CSS3 med border-radius..
http://www.w3schools.com/cssref/css3_pr_border-radius.asp
Avatar billede mik28 Seniormester
11. oktober 2011 - 11:38 #3
Det sidste er smart, bare synd det kun virker i de nyeste browsere
Avatar billede mik28 Seniormester
11. oktober 2011 - 11:40 #4
Hvorfor kan jeg ikke ligge en bunke divs ovenpå hinanden på en sådan måde at det ligner runde hjørner?
Avatar billede keysersoze Ekspert
11. oktober 2011 - 12:02 #5
Det burde du i teorien også kunne, men det kræver nok at du styrer mere end bredden - også top/bottom og left/right position skal nok styres.
Avatar billede NielsErikP Mester
11. oktober 2011 - 12:13 #6
Hej...
#4:
Ved ik om det er dette du mener, men prøv at tage et kig her :

  http://www.udvikleren.dk/artikler/293/hjoerner-med-css-uden-brug-af-grafik/
Avatar billede olebole Juniormester
11. oktober 2011 - 15:19 #7
<ole>

Hvis du vil fylde din kode op med bunker af ligegyldige HTML elementer, der sløver din kode og gør Google-bottens arbejde mere besværlig/unøjagtig, kan du sagtens finde en løsning. Derudover er det løsninger, der strider direkte mod hele meningen med W3C's arbejde omkring HTML og det semantiske web.

I stedet bør du bruge grafik - og ellers vente til CSS3 er understøttet af browserne på WWW

/mvh
</bole>
Avatar billede mik28 Seniormester
17. oktober 2011 - 14:44 #8
Jeg laver det med grafik. Tak for input
Avatar billede NielsErikP Mester
17. oktober 2011 - 21:15 #9
Hej...
Prøv at se denne, hvis du kan bruge CSS:

  http://border-radius.com/
Avatar billede olebole Juniormester
17. oktober 2011 - 21:23 #10
- men CSS3 virker kun i de allernyeste browsere  =)
Avatar billede keysersoze Ekspert
17. oktober 2011 - 21:43 #11
og eftersom over 40% stadig benytter IE8 og IE7 taler vi jo om en klar minoritet ;)

Et svar hvis min kommentar #1 om brug af billeder er den rigtige løsning.
Avatar billede NielsErikP Mester
17. oktober 2011 - 22:56 #12
Hej...

Og efter som de tekniske, som regel følger med tiden, sker der jo intet ved at sætte CSS3 radius kode ind, så må den browser du benytter jo ligesom selvom om der gider reagere på det, men du har da muligheden for det.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester