/ 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
<p> margin modregnes ikke?
Fra : Morten P. Andersen


Dato : 18-08-08 19:24

http://lille-web.net/test/
Kan i se en fejl i designet.

<div id="fod"> her skubber <p> (og andre elementer!) den næste div
nedad. Det kan løses ved : div#fod p { margin-bottom:0;} - men hvorfor
sker det?

Jeg vil selvfølgelig helst lave min container så den fungere ligegyldigt
hvad jeg smider i den!

Højre op på siden bruger jeg : <div style="clear:both"> </div>
for at få en venstre og højre spalte uden specifik height.
<div style="clear:both"> </div> forhindre det ovennævnte problem men den
kan kun bruges en gang på siden - hvorfor det?

Håber I forstår mig.

:)
Morten
www.lille-web.dk

 
 
Morten P. Andersen (18-08-2008)
Kommentar
Fra : Morten P. Andersen


Dato : 18-08-08 19:30

Jeg fandt faktisk selv en løsning ved at indsætte et <br /> til sidst
..... lige før </div>

Men hvorfor det skal være sådan forstår jeg ikke? Så jeg er stadig
interesseret i at høre om hvorfor!

Birger Sørensen (18-08-2008)
Kommentar
Fra : Birger Sørensen


Dato : 18-08-08 21:21

Morten P. Andersen kom med denne ide:
> På http://lille-web.net/test/
> Kan i se en fejl i designet.
>
> <div id="fod"> her skubber <p> (og andre elementer!) den næste div nedad. Det
> kan løses ved : div#fod p { margin-bottom:0;} - men hvorfor sker det?
>
> Jeg vil selvfølgelig helst lave min container så den fungere ligegyldigt hvad
> jeg smider i den!
>
> Højre op på siden bruger jeg : <div style="clear:both"> </div>
> for at få en venstre og højre spalte uden specifik height.
> <div style="clear:both"> </div> forhindre det ovennævnte problem men den kan
> kun bruges en gang på siden - hvorfor det?
>
> Håber I forstår mig.
>
> :)
> Morten
> www.lille-web.dk

Jeg forstår ikke lige, hvad det er du mener.
clear:both, har ikke noget med højden af nogen elementer at gøre.
Den sikrer at elementet den er sat for, starter så langt til venstre
som muligt og slutter så langt til højre som muligt.
Den påvirker altså ikke højden på noget, men derimod bredden. (Og det
kan faktisk ses på din side!)
clear:both anvendes mest til at sikre "afslutning" af floatede
elementer, som f.eks. opbygning af spalter.
En div vil normalt fylde hele den til rådighed værende bredde, med
mindre den begrænses på en eller anden måde.
Derfor har clear:both ingen effekt anden gang, med mindre der er noget
mellem første og anden, der begrænser elementernes bredde.

Birger



Morten P. Andersen (19-08-2008)
Kommentar
Fra : Morten P. Andersen


Dato : 19-08-08 09:28

Birger Sørensen skrev:

>
> Jeg forstår ikke lige, hvad det er du mener.
> clear:both, har ikke noget med højden af nogen elementer at gøre.
> Den sikrer at elementet den er sat for, starter så langt til venstre som
> muligt og slutter så langt til højre som muligt.
> Den påvirker altså ikke højden på noget, men derimod bredden. (Og det
> kan faktisk ses på din side!)
> clear:both anvendes mest til at sikre "afslutning" af floatede
> elementer, som f.eks. opbygning af spalter.
> En div vil normalt fylde hele den til rådighed værende bredde, med
> mindre den begrænses på en eller anden måde.
> Derfor har clear:both ingen effekt anden gang, med mindre der er noget
> mellem første og anden, der begrænser elementernes bredde.
>
> Birger
>
>
nej du misforstå - det er ikke hvad clear:both gør og ikke gør! Det er
hvorfor kan man kun bruge det en gang på en side?

Og så spørgsmålet med hvorfor margin-bottom skubber den div der ligger
under nedad

Birger Sørensen (19-08-2008)
Kommentar
Fra : Birger Sørensen


Dato : 19-08-08 10:20

Morten P. Andersen tastede følgende:
8X
> nej du misforstå - det er ikke hvad clear:both gør og ikke gør! Det er
> hvorfor kan man kun bruge det en gang på en side?
>
> Og så spørgsmålet med hvorfor margin-bottom skubber den div der ligger under
> nedad

;>)
Så må du udtrykke dig lidt klarere...

clear:both kan sagtens bruges mange gange på samme side. Hvis der ikke
er noget imellem de gange det bliver brugt, vil du ikke kunne se
effekten.

margin er en mindste aftand til andre elementer.
margin-bottom _skal_ derfor skubbe efterfølgende elementer nedad.
Jeg kan i øvrigt ikke se nogen steder, at du anvender margin-bottom,
hverken på siden (inline) eller css.

Birger



Morten P. Andersen (19-08-2008)
Kommentar
Fra : Morten P. Andersen


Dato : 19-08-08 12:18

Birger Sørensen skrev:

> Jeg kan i øvrigt ikke se nogen steder, at du anvender margin-bottom,
> hverken på siden (inline) eller css.
>
> Birger
>
>

Nej margin-bottom på eks. <p> kan rede problemet .... men mit spørgsmål
går på hvordan jeg style min div så indholdet ikke tvinger den div der
ligger nedenunder ned

Birger Sørensen (19-08-2008)
Kommentar
Fra : Birger Sørensen


Dato : 19-08-08 14:34

Morten P. Andersen udtrykte præcist:
> Birger Sørensen skrev:
>
>> Jeg kan i øvrigt ikke se nogen steder, at du anvender margin-bottom,
>> hverken på siden (inline) eller css.
>>
>> Birger
>>
>>
>
> Nej margin-bottom på eks. <p> kan rede problemet .... men mit spørgsmål går
> på hvordan jeg style min div så indholdet ikke tvinger den div der ligger
> nedenunder ned

Jo. Margin-bottom flytter indeholder længere nede, så der er minimum
den aftand du sætter som margin-bottom til det.

http://www.w3.org/TR/CSS21/box.html#propdef-margin-bottom

Du bliver nødt til at give et konkret eksempel, hvor man kan se det
problem du slås med.
Tror måske du slås med nogle default værdier. Men det er umuligt at
afgøre et konkret eksempel på et teoretisk grundlag.
Prøv evt
* { padding : 0px; margin : 0px; }
og se om det løser problemet.
Ovenstående er generelt en skidt ide, da det omfatter alle elementer -
også dem hvor man normalt gerne vil beholde default værdier - men kan
bruges til at se om det er den slags man slås med.

Birger



Morten P. Andersen (19-08-2008)
Kommentar
Fra : Morten P. Andersen


Dato : 19-08-08 14:41

Birger Sørensen skrev:

>
> Du bliver nødt til at give et konkret eksempel, hvor man kan se det
> problem du slås med.
> Tror måske du slås med nogle default værdier. Men det er umuligt at
> afgøre et konkret eksempel på et teoretisk grundlag.
> Prøv evt
> * { padding : 0px; margin : 0px; }
> og se om det løser problemet.
> Ovenstående er generelt en skidt ide, da det omfatter alle elementer -
> også dem hvor man normalt gerne vil beholde default værdier - men kan
> bruges til at se om det er den slags man slås med.
>
> Birger
>
>

Eksemplet er jo her: http://lille-web.net/test/ ...... du skal ikke se i
IE ..... men i alle andre browsere!

Allan Vebel (19-08-2008)
Kommentar
Fra : Allan Vebel


Dato : 19-08-08 16:52

Morten P. Andersen skrev:

> Eksemplet er jo her: http://lille-web.net/test/ ...... du
> skal ikke se i IE ..... men i alle andre browsere!

Prøv med

p{
margin:0px;
padding:10px 0 0 0;
}


--
Allan Vebel
http://html-faq.dk
http://vebel.dk



Morten P. Andersen (19-08-2008)
Kommentar
Fra : Morten P. Andersen


Dato : 19-08-08 18:08

Allan Vebel skrev:

>
> Prøv med
>
> p{
> margin:0px;
> padding:10px 0 0 0;
> }
>
>

Yep - det ved jeg godt! Men det jeg ønsker ....hvis man kan .... at lave
min container så den opfører sig efter mine ønsker uden at jeg skal lave
op på stylingen af de elementer jeg fylder i den. Som jeg skrev kunne
det også løses med et <br /> til sidst i container .... men det er
egentlig også noget rod.... men det virker!

Allan Vebel (19-08-2008)
Kommentar
Fra : Allan Vebel


Dato : 19-08-08 23:24

Morten P. Andersen skrev:

> lave min container så den opfører sig efter mine
> ønsker uden at jeg skal lave op på stylingen af de
> elementer jeg fylder i den.

Som jeg ser det, stabler du kasser oven på hinanden,
nulstiller dem, men det går galt når du hælder indhold
i med float.

Prøv i første omgang at undlade float, til du har fundet
fejlen - det er måske float i sig sig selv der laver
problemet.

--
Allan Vebel
http://html-faq.dk
http://vebel.dk



Birger Sørensen (19-08-2008)
Kommentar
Fra : Birger Sørensen


Dato : 19-08-08 16:55

Den 19-08-2008, skrev Morten P. Andersen:
> Birger Sørensen skrev:
>
>>
>> Du bliver nødt til at give et konkret eksempel, hvor man kan se det problem
>> du slås med.
>> Tror måske du slås med nogle default værdier. Men det er umuligt at afgøre
>> et konkret eksempel på et teoretisk grundlag.
>> Prøv evt
>> * { padding : 0px; margin : 0px; }
>> og se om det løser problemet.
>> Ovenstående er generelt en skidt ide, da det omfatter alle elementer - også
>> dem hvor man normalt gerne vil beholde default værdier - men kan bruges til
>> at se om det er den slags man slås med.
>>
>> Birger
>>
>>
>
> Eksemplet er jo her: http://lille-web.net/test/ ...... du skal ikke se i IE
> ..... men i alle andre browsere!

Den kan jeg så ikke lige forklare.
Det ser ud somom du har en tom linie i #content, men der er ikke nogen
i kodningen, andet end hvad der "hører til".
Jeg kan heller ikke finde fejl i hverken XHTML eller CSS.
Jeg ville prøve HTML 4.01 i stedet for XHTML. Syntes jeg husker noget
om at XHTML ikke fortolker CSS med helt samme resultat som HTML.
Eller måske at servere det som "application/xhtml+xml" (som er det
rigtige for XHTML, men ikke alle browsere forstår) i stedet for
"text/html", som er det rigtige for HTML..

Birger



Morten P. Andersen (19-08-2008)
Kommentar
Fra : Morten P. Andersen


Dato : 19-08-08 18:10

Birger Sørensen skrev:

>
> Den kan jeg så ikke lige forklare.
> Det ser ud somom du har en tom linie i #content, men der er ikke nogen i
> kodningen, andet end hvad der "hører til".
> Jeg kan heller ikke finde fejl i hverken XHTML eller CSS.
> Jeg ville prøve HTML 4.01 i stedet for XHTML. Syntes jeg husker noget om
> at XHTML ikke fortolker CSS med helt samme resultat som HTML.
> Eller måske at servere det som "application/xhtml+xml" (som er det
> rigtige for XHTML, men ikke alle browsere forstår) i stedet for
> "text/html", som er det rigtige for HTML..
>
> Birger
>
>

OK - men tak fordi du gad se på det.
:)
Morten

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

Månedens bedste
Årets bedste
Sidste års bedste