/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Paddingproblemet
Fra : NumZie


Dato : 26-01-05 12:12

Jeg fik endelig løst et problem, men jeg fatter ikke, hvorfor løsningen blev
sådan.

Nedenstående kode giver en boks på 250x100. Når man lige tæller sammen, bør
den dog kun være 98 høj, men da jeg i starten havde en padding på 5 i den
første celle, så var boksen 102 høj (hvor jeg mener, den burde være 100).

Hvordan hænger den kode sammen - er der noget, der 'reserveres 2 pixels' til
nogen steder?

<table width="250" border="0" align="center" cellpadding="0" cellspacing="0"
style="background-color: #EFEFEF;">
<tr>
<td style="height: 69px; padding: 4px; font-family: verdana;
font-size: 11px;"><span style="font-weight: bold;">Hvad er
der i vejen?</span><br>
Vi ved det ikke. </td>
</tr>
<tr>
<td style="height: 11px; padding: 5px;" align="right"><a
style="font-family: verdana; font-size: 11px;" href="#">L&aelig;s mere
her</a></td>
</tr>
</table>

/Kenneth



 
 
Jens Gyldenkærne Cla~ (26-01-2005)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 26-01-05 13:57

NumZie skrev:

> Nedenstående kode giver en boks på 250x100. Når man lige tæller sammen, bør
> den dog kun være 98 høj, men da jeg i starten havde en padding på 5 i den
> første celle, så var boksen 102 høj (hvor jeg mener, den burde være 100).

Må vi se siden online?

--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

NumZie (26-01-2005)
Kommentar
Fra : NumZie


Dato : 26-01-05 14:43

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> wrote in message
news:1k7jutxzvssy6.dlg@jcdmfdk.invalid...
> NumZie skrev:
>
>> Nedenstående kode giver en boks på 250x100. Når man lige tæller sammen,
>> bør
>> den dog kun være 98 høj, men da jeg i starten havde en padding på 5 i den
>> første celle, så var boksen 102 høj (hvor jeg mener, den burde være 100).
>
> Må vi se siden online?
>

Desværre ikke - den er ikke offentlig endnu - men den stump kode jeg har
indsat var fra en helt ren side - dvs ingenting udenom - kun den tabel.
Er det nok?

/Kenneth



Martin Hintzmann And~ (26-01-2005)
Kommentar
Fra : Martin Hintzmann And~


Dato : 26-01-05 14:58

NumZie wrote:
>>
>>Må vi se siden online?
>>
>
>
> Desværre ikke - den er ikke offentlig endnu - men den stump kode jeg har
> indsat var fra en helt ren side - dvs ingenting udenom - kun den tabel.
> Er det nok?
>

Nej, vi skal se om din side tricker standard-mode og om den validere,
før man kan finde evt. problemer.

--
Martin Hintzmann Andersen
http://www.hintzmann.dk/

NumZie (26-01-2005)
Kommentar
Fra : NumZie


Dato : 26-01-05 16:41

"Martin Hintzmann Andersen" <no@spam.please> wrote in message
news:41f7a1f1$0$48326$14726298@news.sunsite.dk...
> NumZie wrote:
>>>
>>>Må vi se siden online?
>>>
>>
>>
>> Desværre ikke - den er ikke offentlig endnu - men den stump kode jeg har
>> indsat var fra en helt ren side - dvs ingenting udenom - kun den tabel.
>> Er det nok?
>>
>
> Nej, vi skal se om din side tricker standard-mode og om den validere, før
> man kan finde evt. problemer.

Jamen så har jeg da lige lagt den op - www.kennethbon.dk/test.htm

/Kenneth



Martin Hintzmann And~ (27-01-2005)
Kommentar
Fra : Martin Hintzmann And~


Dato : 27-01-05 00:16

NumZie wrote:
>
> Jamen så har jeg da lige lagt den op - www.kennethbon.dk/test.htm
>

Hos mig i Firefox 1.0 og Opera 8.0b på en Windows XP er height 92px.
Test selv efter med følgende i URL'en:

javascript:alert(window.getComputedStyle(document.getElementsByTagName('table')[0],
null).getPropertyValue('height'));

IE har deres egen måde at finde height
javascript:alert(document.getElementsByTagName('table')[0].currentStyle.height);

Men den returnere desværre kun "auto"

Ved hjælp af printScreen og indsætte det i et tegneprogram, har jeg målt
den til at være 100px i height.

Jeg har prøvet at sætte font-size og line-height til 11px, men det hjalp
heller ikke rigtigt.

Men... du kan gøre det på en anden måde.

Lav en div med 2 div elementer i.

Den første div positionere du relativt og giver en fast height og width.
De 2 inderste div blokke absolute positionere du, med en top - left og
en bottom - right.

<div style="position:relative;width:250px;height:100px;background:red;">
<div style="position:absolute;top:0;left:0;background:blue;">a</div>
<div style="position:absolute;bottom:0;right:0;background:yellow;">b</div>
</div>

Det er ikke svar på det du spurgte om, men det er en alterntiv løsning.
Håber at du kan bruge det

--
Martin Hintzmann Andersen
http://www.hintzmann.dk/

NumZie (27-01-2005)
Kommentar
Fra : NumZie


Dato : 27-01-05 08:34

"Martin Hintzmann Andersen" <no@spam.invalid> wrote in message
news:41f824c9$0$48324$14726298@news.sunsite.dk...
> NumZie wrote:
>>
>> Jamen så har jeg da lige lagt den op - www.kennethbon.dk/test.htm
>>
>
> Hos mig i Firefox 1.0 og Opera 8.0b på en Windows XP er height 92px.
> Test selv efter med følgende i URL'en:
>
> javascript:alert(window.getComputedStyle(document.getElementsByTagName('table')[0],
> null).getPropertyValue('height'));
>
> IE har deres egen måde at finde height
> javascript:alert(document.getElementsByTagName('table')[0].currentStyle.height);
>
> Men den returnere desværre kun "auto"
>
> Ved hjælp af printScreen og indsætte det i et tegneprogram, har jeg målt
> den til at være 100px i height.
>
> Jeg har prøvet at sætte font-size og line-height til 11px, men det hjalp
> heller ikke rigtigt.
>
> Men... du kan gøre det på en anden måde.
>
> Lav en div med 2 div elementer i.
>
> Den første div positionere du relativt og giver en fast height og width.
> De 2 inderste div blokke absolute positionere du, med en top - left og en
> bottom - right.
>
> <div style="position:relative;width:250px;height:100px;background:red;">
> <div style="position:absolute;top:0;left:0;background:blue;">a</div>
> <div
> style="position:absolute;bottom:0;right:0;background:yellow;">b</div>
> </div>
>
> Det er ikke svar på det du spurgte om, men det er en alterntiv løsning.
> Håber at du kan bruge det

Jo tak :) Næste gang jeg skal lave ny side, skal jeg vist bruge layers. Men
lige på denne her side skal det hele foregå i tabeller - efter 'ordrer'
andetsteds fra :)

Men jeg må jo se, hvad jeg kan finde på... men kan du hjælpe mig med at
forstå hvordan IE kan lave den 100px og FF m. fl. 94, når nu padding er sat,
som den er? Jeg ville mene, at 80 + (2x5) + (2x4) skulle kunne fortolkes på
den rigtige måde af FF (98) - hvor IE jo sikkert har et (af flere :)
problemer.

Jeg må lige se, om jeg kan lov til at div'e de her ting - eller omgås det på
anden måde - tak for bidraget i hvert fald.

/Kenneth



Martin Hintzmann And~ (27-01-2005)
Kommentar
Fra : Martin Hintzmann And~


Dato : 27-01-05 09:23

NumZie wrote:
>
> Jo tak :) Næste gang jeg skal lave ny side, skal jeg vist bruge layers. Men
> lige på denne her side skal det hele foregå i tabeller - efter 'ordrer'
> andetsteds fra :)
>

Ja, det er ikke sjovt at blive dikteret oppe fra med hvilken teknologi
man skal lave tingene med.

Forstil dig at være håndværker og få besked fra mester om at slå en
skrue i en væg med en hammer!
Det ville være bedre blot at få at vide at skruen skal i vægen, og så
selv kunne vælge værktøj... f.eks. en skrue-trækker/-maskine.

> Men jeg må jo se, hvad jeg kan finde på... men kan du hjælpe mig med at
> forstå hvordan IE kan lave den 100px og FF m. fl. 94, når nu padding er sat,
> som den er? Jeg ville mene, at 80 + (2x5) + (2x4) skulle kunne fortolkes på
> den rigtige måde af FF (98) - hvor IE jo sikkert har et (af flere :)
> problemer.
>

Jeg tror umiddelbart at det kan have noget at gøre med line-height.
Browserne har forskellige standard værdier for CSS egeneskaberne. Så
prøv at nulstil... eller rettere sætte dem ens. Det gælder sig både for
padding, margin, font-size, line-height... og dem jeg nu mangler

> Jeg må lige se, om jeg kan lov til at div'e de her ting - eller omgås det på
> anden måde - tak for bidraget i hvert fald.
>

Ja, hør mester om du ikke må bruge en skruetrækker

--
Martin Hintzmann Andersen
http://www.hintzmann.dk/

Lobais (26-01-2005)
Kommentar
Fra : Lobais


Dato : 26-01-05 18:58

Wed, 26 Jan 2005 12:12:01 +0100. skrev NumZie:
> Jeg fik endelig løst et problem, men jeg fatter ikke, hvorfor løsningen blev
> sådan.

Det kaldes box-sizing. Nogle browsere understøtter tagget box-sizing, der
gør det muligt at bestemme om height og width tagene skal bestemme
størrelsen uden om content, padding eller border. IE fatter dog aldrig
noget, og gør præcis som det passer den. For at få noget, der i
browserene minder om hinanden brug:
http://tantek.com/CSS/Examples/boxmodelhack.html


--
Lobais - http://thomas.ahle.dk/
Einstein - Science without religion is lame, religion without science is blind.


NumZie (26-01-2005)
Kommentar
Fra : NumZie


Dato : 26-01-05 19:50

"Lobais" <thomas@ahle.dk> wrote in message
news:pan.2005.01.26.17.57.51.697081@ahle.dk...
> Wed, 26 Jan 2005 12:12:01 +0100. skrev NumZie:
>> Jeg fik endelig løst et problem, men jeg fatter ikke, hvorfor løsningen
>> blev
>> sådan.
>
> Det kaldes box-sizing. Nogle browsere understøtter tagget box-sizing, der
> gør det muligt at bestemme om height og width tagene skal bestemme
> størrelsen uden om content, padding eller border. IE fatter dog aldrig
> noget, og gør præcis som det passer den. For at få noget, der i
> browserene minder om hinanden brug:
> http://tantek.com/CSS/Examples/boxmodelhack.html
>

Jep - den løb jeg også ind i - i min søgen efter hva' pokker, der skete :)

Men - jeg forstår nu stadig ikke hvordan de angivne paddings i min kode kan
gøre en tabel 100 høj. Så vidt jeg kan regne ud bør den stadig være 98 :?

/Kenneth



Søg
Reklame
Statistik
Spørgsmål : 177502
Tips : 31968
Nyheder : 719565
Indlæg : 6408534
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste