/ 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
Float og bokse - tekst flyder ind bag boks~
Fra : Thomas L. Pilegaard


Dato : 09-02-07 08:15

Hvordan undgår man at tekst flyder om bag tekstbokse ?

Følgende er kun et konstrueret eksempel, men jeg fatter ikke lige
hvorfor teksten flyder om bag boksene. Der er et eller andet jeg
overser:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1.0-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="da">
<head>
<title>Container test</title>
</head>
<body>

<div style="position:absolute; width:230px; height:120px;
background-color:#ffffaa; float:left">

<div style="position:absolute; left:10px; top:10px; width:100px;
height:100px; background-color:#ffaaaa">
red box - red box
</div>

<div style="position:absolute; left:120px; top:10px; width:100px;
height:100px; background-color:#aaaaff">
blue box - blue box
</div>
</div>

<div>
Hvorfor er det lige at denne tekst flyder om bag boksene ? Det er dog
irriterende !
</div>

</body>
</html>


mvh Thomas


 
 
Martin (09-02-2007)
Kommentar
Fra : Martin


Dato : 09-02-07 09:05

Thomas L. Pilegaard wrote:
> Hvordan undgår man at tekst flyder om bag tekstbokse ?
>
> Følgende er kun et konstrueret eksempel, men jeg fatter ikke lige
> hvorfor teksten flyder om bag boksene. Der er et eller andet jeg
> overser:
>
> <?xml version="1.0" encoding="iso-8859-1"?>

Fjern denne linje, da den sætter IE i quirksmode
<http://hintzmann.dk/articles/doctype/>

> <div>
> Hvorfor er det lige at denne tekst flyder om bag boksene ? Det er dog
> irriterende !
> </div>

Prøv at sætte en style="clear:both;" ind i dit div tag
<http://www.html.dk/tutorials/css/lektion13.asp> nederst

Jørn Andersen (09-02-2007)
Kommentar
Fra : Jørn Andersen


Dato : 09-02-07 15:05

On Fri, 09 Feb 2007 09:05:24 +0100, Martin <maaNO@SPAMscandesigns.dk>
wrote:

>> <div>
>> Hvorfor er det lige at denne tekst flyder om bag boksene ? Det er dog
>> irriterende !
>> </div>
>
>Prøv at sætte en style="clear:both;" ind i dit div tag
><http://www.html.dk/tutorials/css/lektion13.asp> nederst

Det hjælper ikke at sætte clear, når der ikke er nogen floats.


Mvh. Jørn

--
Jørn Andersen,
Brønshøj

Martin (09-02-2007)
Kommentar
Fra : Martin


Dato : 09-02-07 15:40

Jørn Andersen wrote:
> Det hjælper ikke at sætte clear, når der ikke er nogen floats.

Hovsa - nej selvfølgelig ikke.
Troede jeg åbenbart jeg havde set en float :)

Jørn Andersen (09-02-2007)
Kommentar
Fra : Jørn Andersen


Dato : 09-02-07 15:04

On Fri, 09 Feb 2007 08:15:14 +0100, Thomas L. Pilegaard
<dundee@worldonline.dk> wrote:

>Hvordan undgår man at tekst flyder om bag tekstbokse ?
>
>Følgende er kun et konstrueret eksempel, men jeg fatter ikke lige
>hvorfor teksten flyder om bag boksene. Der er et eller andet jeg
>overser:
<snip>
><div style="position:absolute; width:230px; height:120px;
>background-color:#ffffaa; float:left">
>
><div style="position:absolute; left:10px; top:10px; width:100px;
>height:100px; background-color:#ffaaaa">
>red box - red box
></div>
>
><div style="position:absolute; left:120px; top:10px; width:100px;
>height:100px; background-color:#aaaaff">
>blue box - blue box
></div>
></div>

Ovenstående er absolut positionerede. Det betyder, at de ikke indgår i
sidens normale "flow" - men blot er placeret poå bestemte positioner
på siden.

Den efterfølgende tekst:
><div>
>Hvorfor er det lige at denne tekst flyder om bag boksene ? Det er dog
>irriterende !
></div>

- vil derfor starte fra toppen af siden.
Hvis du giver din tekst-div en margin-top på ca. 120px burde det falde
på plads.

Good luck!

--
Jørn Andersen,
Brønshøj

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

Månedens bedste
Årets bedste
Sidste års bedste