/ 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
Min "div" er for høj
Fra : Niels Andersen


Dato : 26-08-02 16:42

Jeg laver en slags søjlediagram ved at hver søjle er en tom div, med
baggrundsfarve. Det fungerer glimrende, undtagen i IE (5.5).

HTML:
<div class="bar" style="width: 150px;"></div>

CSS:
..bar {
width: 200px;
height: 5px;
color: #000000;
background-color: #99d6ad;
padding: 0px;
margin: 0px 0px 5px 0px;
line-height: 0px;
}

Som i kan se sætter jeg længden (altså bredden) med HTML.

Det virker fint i Konqueror og Mozilla (der kommer dog ingen margin under i
Konqueror, men det er ikke så vigtigt), men i IE er baren alt for tyk
(høj). Jeg har forsøgt at justere dette ved at sætte padding, margin og
line-height. Det er dog ikke ændret noget.

I kan se det i funktion her:
http://snyd.dk/display/?platform=pc

Jeg bruger HTML 4.01 Transistional. IE skulle gerne følge W3C-standarden, og
ikke sin egen.

--
Mvh.

Niels Andersen
(la nels. anersyn.)

 
 
Chrisser (27-08-2002)
Kommentar
Fra : Chrisser


Dato : 27-08-02 07:32


"Niels Andersen" <niels-usenet@myplace.dk> skrev i en meddelelse
news:0%ra9.21744$ww6.2226766@news010.worldonline.dk...
> Jeg laver en slags søjlediagram ved at hver søjle er en tom div, med
> baggrundsfarve. Det fungerer glimrende, undtagen i IE (5.5).
>
> HTML:
> <div class="bar" style="width: 150px;"></div>
>
> CSS:
> .bar {
> width: 200px;
> height: 5px;
> color: #000000;
> background-color: #99d6ad;
> padding: 0px;
> margin: 0px 0px 5px 0px;
> line-height: 0px;
> }
>
> Som i kan se sætter jeg længden (altså bredden) med HTML.

- hvorfor sætter du så også width i CSS ???

> Det virker fint i Konqueror og Mozilla (der kommer dog ingen margin under
i
> Konqueror, men det er ikke så vigtigt), men i IE er baren alt for tyk
> (høj). Jeg har forsøgt at justere dette ved at sætte padding, margin og
> line-height. Det er dog ikke ændret noget.

Jeg kan ikke sige hvad der er galt, men du kan jo prøve med max-height
istedet for.
Jeg kører med en IE6.0, og kan godt se at den er mere end 5px høj, men det
ser ikke grimt ud !

Her kommer et link til alle attributter i WC3-standarden :

http://www.w3.org/TR/1998/REC-CSS2-19980512/propidx.html

Dog ved jeg at visse af de attributter ikke understøttes af IE, bla
page-break-after og andre beslægtede til brug for udprintning af sider.
Noget af dette kan ses på:

http://www.westciv.com/style_master/academy/browser_support/printing.html

MVH
Chrisser



Niels Andersen (27-08-2002)
Kommentar
Fra : Niels Andersen


Dato : 27-08-02 08:10

Chrisser wrote in <akf6f7$c3l$1@sunsite.dk>:
news:0%ra9.21744$ww6.2226766@news010.worldonline.dk...
>> Jeg laver en slags søjlediagram ved at hver søjle er en tom div, med
>> baggrundsfarve. Det fungerer glimrende, undtagen i IE (5.5).
>>
>> HTML:
>> <div class="bar" style="width: 150px;"></div>
>>
>> CSS:
>> .bar {
>> width: 200px;
>> height: 5px;
>> color: #000000;
>> background-color: #99d6ad;
>> padding: 0px;
>> margin: 0px 0px 5px 0px;
>> line-height: 0px;
>> }
>>
>> Som i kan se sætter jeg længden (altså bredden) med HTML.
> - hvorfor sætter du så også width i CSS ???

Tjah, jeg synes det var mest logisk.
Det vil ikke ændre noget (og dermed ikke genere), medmindre der ikke er
defineret bredde i HTML'en. Og er der ikke det, så vil problemet blive en
sjat mindre af, at der er en fornuftig default...

>> men i IE er baren alt for tyk
>> (høj). Jeg har forsøgt at justere dette ved at sætte padding, margin og
>> line-height. Det er dog ikke ændret noget.
>
> Jeg kan ikke sige hvad der er galt, men du kan jo prøve med max-height
> istedet for.

Det ændrer heller ikke noget.

> Jeg kører med en IE6.0, og kan godt se at den er mere end 5px høj, men det
> ser ikke grimt ud !

Det er også derfor jeg ikke hev det af siden igen, da jeg opdagede det. :)
Men derfor vil jeg nu alligevel gerne have problemet løst. Dels ser det ikke
ud, som jeg vil have det, og dels ville det være rart at kende en løsning
(eller i det mindste en årsag), til hvis jeg skulle støde på det igen, hvor
det er mere afgørende.

--
Mvh.

Niels Andersen
(la nels. anersyn.)

Chrisser (27-08-2002)
Kommentar
Fra : Chrisser


Dato : 27-08-02 08:32


"Niels Andersen" <niels-usenet@myplace.dk> skrev i en meddelelse
news:nBFa9.22562$ww6.2346338@news010.worldonline.dk...
>
> Det er også derfor jeg ikke hev det af siden igen, da jeg opdagede det. :)
> Men derfor vil jeg nu alligevel gerne have problemet løst. Dels ser det
ikke
> ud, som jeg vil have det, og dels ville det være rart at kende en løsning
> (eller i det mindste en årsag), til hvis jeg skulle støde på det igen,
hvor
> det er mere afgørende.
>
> --
> Mvh.
>
> Niels Andersen
> (la nels. anersyn.)

Det kan jeg kun give dig ret i, jeg kan heller ikke fordrage ikke at vide
hvorfor, desværre er det nogle gange sådan at det ikke slår igennem i IE, og
jeg kender tit ikke grunden - heller ikke til din 'bug'.

- måske andre gør ????
MVH
Chrisser



Asbjørn Sloth Tønnes~ (27-08-2002)
Kommentar
Fra : Asbjørn Sloth Tønnes~


Dato : 27-08-02 13:10

Det er fordi at IE ikke vil have at bar er lavere end en linie medmindre at
du fortæller IE den ikke skal ændre på størrelsen på bar, med
"overflow:hidden;"
http://www.w3.org/TR/REC-CSS2/visufx.html#overflow

Prøv med

HTML:
<div class="bar" style="width: 150px;">&nbsp;</div>

CSS:
..bar {
width: 200px;
height: 5px;
color: #000000;
background-color: #99d6ad;
padding: 0px;
margin: 0px 0px 5px 0px;
line-height: 0px;
overflow:hidden;
}

Asbjørn
----------------------------------
Jeg er 15 år og søger praktikplads i uge 43. Jeg kan
(X)HTML, CSS, Javascript, PHP, ASP, SQL, Visual Basic 6, XML,
XSLT, SVG m.m. asbjorn@caduceus.dk



Chrisser (27-08-2002)
Kommentar
Fra : Chrisser


Dato : 27-08-02 13:20


"Asbjørn Sloth Tønnesen" <asbjorn@caduceus.dk> skrev i en meddelelse
news:o_Ja9.23741$ww6.2382681@news010.worldonline.dk...
> Det er fordi at IE ikke vil have at bar er lavere end en linie medmindre
at
> du fortæller IE den ikke skal ændre på størrelsen på bar, med
> "overflow:hidden;"
> http://www.w3.org/TR/REC-CSS2/visufx.html#overflow
>
> Prøv med
>
> HTML:
> <div class="bar" style="width: 150px;">&nbsp;</div>
>
> CSS:
> .bar {
> width: 200px;
> height: 5px;
> color: #000000;
> background-color: #99d6ad;
> padding: 0px;
> margin: 0px 0px 5px 0px;
> line-height: 0px;
> overflow:hidden;
> }
>
> Asbjørn
> ----------------------------------
> Jeg er 15 år og søger praktikplads i uge 43. Jeg kan
> (X)HTML, CSS, Javascript, PHP, ASP, SQL, Visual Basic 6, XML,
> XSLT, SVG m.m. asbjorn@caduceus.dk
>
- der kan man bare se - den er hermed lagret i hukommelsen.
Hvis jeg var dig ville jeg tilføje hvor i landet du søger praktikplads



Niels Andersen (27-08-2002)
Kommentar
Fra : Niels Andersen


Dato : 27-08-02 13:32

Asbjørn Sloth Tønnesen wrote in
<o_Ja9.23741$ww6.2382681@news010.worldonline.dk>:
> Det er fordi at IE ikke vil have at bar er lavere end en linie medmindre
> at du fortæller IE den ikke skal ændre på størrelsen på bar, med
> "overflow:hidden;"

Dit indlæg mindede mig om, at "line-hight" ikke definerer højde på linjerne,
men afstanden mellem linjerne.
"font-size: 1px" gjorde linjen så lav, at den kunne være i de 5 pixels.

Det virkede, og jeg kan dermed konkludere, at IE gør plads til tekst, som
ikke er der. Det tror jeg ikke er meningen.

Jeg putter nok en "overflow: hidden;" ind alligevel. Det løser ikke det
egentlige problem, men forhindrer det (og måske andre?) i at blive synlige.

--
Mvh.

Niels Andersen
(la nels. anersyn.)

Chrisser (27-08-2002)
Kommentar
Fra : Chrisser


Dato : 27-08-02 13:38


"Niels Andersen" <niels-usenet@myplace.dk> skrev i en meddelelse
news:ViKa9.23844$ww6.2385978@news010.worldonline.dk...
> Asbjørn Sloth Tønnesen wrote in
> <o_Ja9.23741$ww6.2382681@news010.worldonline.dk>:
> > Det er fordi at IE ikke vil have at bar er lavere end en linie medmindre
> > at du fortæller IE den ikke skal ændre på størrelsen på bar, med
> > "overflow:hidden;"
>
> Dit indlæg mindede mig om, at "line-hight" ikke definerer højde på
linjerne,
> men afstanden mellem linjerne.
> "font-size: 1px" gjorde linjen så lav, at den kunne være i de 5 pixels.
>
> Det virkede, og jeg kan dermed konkludere, at IE gør plads til tekst, som
> ikke er der. Det tror jeg ikke er meningen.
>
> Jeg putter nok en "overflow: hidden;" ind alligevel. Det løser ikke det
> egentlige problem, men forhindrer det (og måske andre?) i at blive
synlige.
>
> --
> Mvh.
>
> Niels Andersen
> (la nels. anersyn.)

- for mig (IE6.0) ser det nu ud som om at der er en margin i bunden !!!

Chrisser



Niels Andersen (27-08-2002)
Kommentar
Fra : Niels Andersen


Dato : 27-08-02 14:41

Chrisser wrote in <akfru2$91t$1@sunsite.dk>:
> - for mig (IE6.0) ser det nu ud som om at der er en margin i bunden !!!
>

Ja, det skulle der også gerne være...

--
Mvh.

Niels Andersen
(la nels. anersyn.)

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

Månedens bedste
Årets bedste
Sidste års bedste