/ 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
CSS: Hvorfor udvider padding bredden?
Fra : henrik


Dato : 22-07-04 18:35

Jeg har en boks i CSS, lavet med <div>. Men når jeg vælger
padding-left: 8px; bliver hele boksen 8 pixels bredere end jeg
har angivet i width i IE6.

Det må da kunne laves på en smart måde?

pft,
Henrik

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Jens Gyldenkærne Cla~ (22-07-2004)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 22-07-04 19:00

henrik skrev:

> Jeg har en boks i CSS, lavet med <div>. Men når jeg vælger
> padding-left: 8px; bliver hele boksen 8 pixels bredere end jeg
> har angivet i width i IE6.

Det er meningen - jf. boksmodellen i CSS. Dog har tidligere
versioner af IE (og IE6 i quirks mode) opfattet det anderledes.

> Det må da kunne laves på en smart måde?

Ja - angiv width 8px mindre.
--
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

henrik (22-07-2004)
Kommentar
Fra : henrik


Dato : 22-07-04 19:04

Jens GyldenkærneClausen wrote in dk.edb.internet.webdesign.html:
> henrik skrev:
>
> > Jeg har en boks i CSS, lavet med <div>. Men når jeg vælger
> > padding-left: 8px; bliver hele boksen 8 pixels bredere end
jeg
> > har angivet i width i IE6.
>
> Det er meningen - jf. boksmodellen i CSS. Dog har tidligere
> versioner af IE (og IE6 i quirks mode) opfattet det anderledes.
>
> > Det må da kunne laves på en smart måde?
>
> Ja - angiv width 8px mindre.

Jamen det er jo helt håbløst fra IE5.5 og nedefter, hvor
padding-størrelsen er inkluderet i width...

Der må da være en løsning, der virker i alle browsere?

Pft,
H

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jens Gyldenkærne Cla~ (22-07-2004)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 22-07-04 19:25

henrik skrev:

> Jamen det er jo helt håbløst fra IE5.5 og nedefter, hvor
> padding-størrelsen er inkluderet i width...

Ikke håbløst, men besværligt.

> Der må da være en løsning, der virker i alle browsere?

Nej - eftersom andre browsere ikke anvender IEs gamle
fejlopfattelse er det ikke muligt. Men du kan bruge conditional
comments til at rette op på IE5.x-problemerne.
--
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

henrik (22-07-2004)
Kommentar
Fra : henrik


Dato : 22-07-04 19:28

Jens GyldenkærneClausen wrote in dk.edb.internet.webdesign.html:
> henrik skrev:
>
> > Jamen det er jo helt håbløst fra IE5.5 og nedefter, hvor
> > padding-størrelsen er inkluderet i width...
>
> Ikke håbløst, men besværligt.
>
> > Der må da være en løsning, der virker i alle browsere?
>
> Nej - eftersom andre browsere ikke anvender IEs gamle
> fejlopfattelse er det ikke muligt. Men du kan bruge conditional
> comments til at rette op på IE5.x-problemerne.

OK tak! Nu har jeg vist spurgt nok for i dag - men jeg forstår
ikke helt hvad du mener med conditional comments, det har jeg
aldrig hørt om før?

Henrik

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Lasse Reichstein Nie~ (22-07-2004)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 22-07-04 19:34

henrik <hku@tiscali.dk> writes:

[CSS box-model]
> Jamen det er jo helt håbløst fra IE5.5 og nedefter, hvor
> padding-størrelsen er inkluderet i width...
>
> Der må da være en løsning, der virker i alle browsere?

Ja, giv forskellig CSS til gamle IE'er og til moderne browsere.
Jeg ville bruge betingede kommentarer:

<!--[if ! IE 6]>
Noget *kun* til IE 5 + 5.5
<![endif]-->

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

henrik (22-07-2004)
Kommentar
Fra : henrik


Dato : 22-07-04 19:37

> [CSS box-model]
> > Jamen det er jo helt håbløst fra IE5.5 og nedefter, hvor
> > padding-størrelsen er inkluderet i width...
> >
> > Der må da være en løsning, der virker i alle browsere?
>
> Ja, giv forskellig CSS til gamle IE'er og til moderne browsere.
> Jeg ville bruge betingede kommentarer:
>
> <!--[if ! IE 6]>
&gt; Noget *kun* til IE 5 + 5.5
&gt; <![endif]-->

Tak! Hvor kan jeg læse mere om det, for jeg forstår ikke helt dette?


Pft,
H


--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Lasse Reichstein Nie~ (22-07-2004)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 22-07-04 19:59

henrik <hku@tiscali.dk> writes:

[IE-conditional comments]
> Tak! Hvor kan jeg læse mere om det, for jeg forstår ikke helt dette?

Prøv:
<URL:http://www.google.com/search?q=conditional+comments&btnI=I%27m+Feeling+Lucky>

De virker kun i Internet Explorer (hvilket netop er det smarte ved
dem, fordi det er typisk IE der har brug for specialbehandling - det
gamle lort :)

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Jens Gyldenkærne Cla~ (22-07-2004)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 22-07-04 20:44

Lasse Reichstein Nielsen skrev:

> [IE-conditional comments]

> <URL:http://www.google.com/search?q=conditional+comments&btnI=I
> %27m+Feeling+Lucky>

Han kan også prøve Martin Hintzmanns side om at skjule css:
<http://www.hintzmann.dk/articles/skjulecss/>.

> De virker kun i Internet Explorer (hvilket netop er det smarte
> ved dem, fordi det er typisk IE der har brug for
> specialbehandling

Jep - men desværre virker det ikke til Mac-udgaver af IE - der
ellers også kunne trænge til specialbehandling.
--
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

Stig Johansen (23-07-2004)
Kommentar
Fra : Stig Johansen


Dato : 23-07-04 06:13

Jens Gyldenkærne Clausen wrote:

> Han kan også prøve Martin Hintzmanns side om at skjule css:
> <http://www.hintzmann.dk/articles/skjulecss/>.

I min Konqueror 3.2.0 virker følgende:
- se\lector { declarations }
- html:not( [dummy] ) selector
- p\roperty: value;

--
Med venlig hilsen
Stig Johansen

Jens Gyldenkærne Cla~ (23-07-2004)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 23-07-04 09:20

Stig Johansen skrev:

>> Han kan også prøve Martin Hintzmanns side om at skjule css:
>> <http://www.hintzmann.dk/articles/skjulecss/>.
>
> I min Konqueror 3.2.0 virker følgende:

Hvad mener du med "virker"? Skjules deklarationerne eller bliver de
vist?

Er det anderledes end den supportnøgle som Martin angiver på siden
(i så fald vil jeg foreslå dig at sende ham en mail med
forskellene).
--
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

Stig Johansen (24-07-2004)
Kommentar
Fra : Stig Johansen


Dato : 24-07-04 07:03

Jens Gyldenkærne Clausen wrote:

> Hvad mener du med "virker"? Skjules deklarationerne eller bliver de
> vist?

Undskyld den uklare formulering.

Det jeg mener er, at der formentlig er sket nogle opdateringer i Konqueror
siden tabellen på den omtalte side er lavet.
I rækkerne med de 3 titler jeg skrev, står der N under Konqueror, hvorimod
'Teksten er grøn' når jeg kalder linket.

Du har ret i, at jeg nok burde sende ham en mail i stedet for.
(Det må jeg prøve at huske næste gang jeg starter min Windows)

--
Med venlig hilsen
Stig Johansen

Claus Jacobsen (22-07-2004)
Kommentar
Fra : Claus Jacobsen


Dato : 22-07-04 21:56

henrik wrote:
> Jeg har en boks i CSS, lavet med <div>. Men når jeg vælger
> padding-left: 8px; bliver hele boksen 8 pixels bredere end jeg
> har angivet i width i IE6.
>

Det kommer an på hvad du har angivet som dokumenttype! Browsere har i
bund og grund 2 tilstande: quirks eller standard mode og i standard
følger selv IE alle standarder, det medfører at den samlede bredde i en
div er ang. bredde + 2x padding + 2x margin, da det er angivet sådan i
W3c's anbefalinger!

> Det må da kunne laves på en smart måde?

Få IE i standardsmode og så er der ikke de store problemer!
(det i sig selv kan så engang imellem være et problem, men kig her, der
forklarer Microsoft selv hvordan man får IE i standardsmode!
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp

>
> pft,
> Henrik
>
Håber det hjælper


Claus

Jens Gyldenkærne Cla~ (22-07-2004)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 22-07-04 22:39

Claus Jacobsen skrev:

> det medfører at den samlede bredde i en div er ang. bredde +
> 2x padding + 2x margin,

Niks - margen er ikke med (kant er til gengæld).

Den viste bredde af en boks er følgende sum (efter W3-standarden):

border-left + padding-left + width + padding-right + border-right
--
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

Claus Jacobsen (22-07-2004)
Kommentar
Fra : Claus Jacobsen


Dato : 22-07-04 23:07

Jens Gyldenkærne Clausen wrote:
> Claus Jacobsen skrev:
>
>
>>det medfører at den samlede bredde i en div er ang. bredde +
>>2x padding + 2x margin,
>
>
> Niks - margen er ikke med (kant er til gengæld).
>
> Den viste bredde af en boks er følgende sum (efter W3-standarden):
>
> border-left + padding-left + width + padding-right + border-right


Uppssss my misser! Nu vi er ved standarderne prøv at læse denne artikel:
http://www.sitepoint.com/article/standards-sensible-design han har
faktisk nogle frygtelig gode argumenter!


Claus

Søg
Reklame
Statistik
Spørgsmål : 177554
Tips : 31968
Nyheder : 719565
Indlæg : 6408852
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste