Avatar billede pnr Nybegynder
06. april 2006 - 10:32 Der er 14 kommentarer og
1 løsning

Styling af knap

Hvordan justere jeg afstanden fra kanten af knappen og indtil teksten?
Avatar billede fennec Nybegynder
06. april 2006 - 10:44 #1
<input type="Button" value="hej" style="padding:10px;" onClick="">
Avatar billede pnr Nybegynder
06. april 2006 - 10:50 #2
Jeg vil gerne forminske afstanden
Avatar billede fennec Nybegynder
06. april 2006 - 11:04 #3
Så skal du over i width og height, men så kan du komme til at klippe i teksten:
<input type="Button" value="dfvdvf" style="width:30px;height:20px;" onClick="">
Avatar billede mclemens Nybegynder
06. april 2006 - 12:43 #4
komme til at klippe i teksten: ... medmindre du sørger for at bruge font-size også <input type="Button" value="dfvdvf" style="font-size:7px;width:30px;height:20px;" onClick="">
Avatar billede milandt Nybegynder
06. april 2006 - 13:08 #5
du kan ikke "skære" helt ind til teksten på en button - i al fald ikke i alle browsere.

Hvis det er det du vil bliver du nok nødt til at bruge f.eks et link til dette, og style dit link ligesom en knap - noget a'la:

<style type="text/css">
  a.button {font-family:arial, verdana;font-size:12px; text-decoration:none; border:1px solid black; background-color:#999; color:black; padding-left:2px; padding-right:2px}
</style>

<a href="#" class="button">Klik her</a>
Avatar billede milandt Nybegynder
06. april 2006 - 13:09 #6
og et onclick event. husk return false, ellers prøver siden at gå til '#' hvilket ikke er hensigten.

<a href="#" class="button" onclick="doYourStuff();return false;">Klik her</a>
Avatar billede mclemens Nybegynder
06. april 2006 - 13:17 #7
er det ikke bedre at putte onclick ind i href'en :)
<a href="java script:doYourStuff();" class="button">Klik her</a>
Avatar billede milandt Nybegynder
06. april 2006 - 14:18 #8
nope
Avatar billede milandt Nybegynder
06. april 2006 - 14:47 #9
Der findes massere af diskussioner om hvornår man bør bruge href og hvornår man skal bruge onclick eventet til at trigger noget javascript kode - men min holdning er at med mindre man vil submitte noget eller gå til en ny side bør man bruge onclick.

href kan med fordel bruges som fallback hvis brugeren ikke har javascript slået til. f.eks <a href="page.html?param=123" onclick="alert('123');return false;">Klik her for at se "123"</a> - Jeg er sikker på at du forstår meningen. pga return false bliver href ignoreret, og hvis js ikke er slået til bliver onlcick ignoreret.



Du kan læse mere om andres meninger og holdninger f.eks. her

http://news.hping.org/comp.lang.javascript.archive/12089.html

eller andre steder hvis du spørger google
Avatar billede pnr Nybegynder
06. april 2006 - 14:49 #10
Jeg takker for hjælpen :-)
Avatar billede fennec Nybegynder
06. april 2006 - 14:57 #11
Hvilken løsning valgte du, for det var mig der fik point, og brugte du <a href..> metoden skulle de gå til milandt istedet??
Avatar billede pnr Nybegynder
06. april 2006 - 14:58 #12
Jeg valgte din løsning :-)
Avatar billede fennec Nybegynder
06. april 2006 - 15:04 #13
Ok. Skulle bare være sikker.
.o) <-- One Eyed Jack
Avatar billede milandt Nybegynder
06. april 2006 - 15:16 #14
Man skal jo selvfølgelig også altid tilstræbe at bruge html elementerne som de er tiltænkt - dvs skal man bruge en knap bør man vælge en button, skal man bruge en boks bør man vælge en div, skal man bruge en overskrift bør man vælge et heading element osv..

Forslaget omkring at bruge et link var udelukkende for at opnå mere kontrol over hvordan "knappen" kunne styles, da du ønskede mindre padding end du umiddelbart har mulighed med en button.
Avatar billede mclemens Nybegynder
06. april 2006 - 16:38 #15
href kan med fordel bruges som fallback hvis brugeren ikke har javascript slået til. f.eks <a href="page.html?param=123" onclick="alert('123');return false;">Klik her for at se "123"</a>... - Jeg er sikker på at du forstår meningen>
- Ja den er i vinkel - accessibility ... fornuftigt nok ... :)
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