/ 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
Div-positionering
Fra : Jonas Koch Bentzen


Dato : 19-11-02 23:23

Hvis man vil have flere div'er placeret ved siden af hinanden (frem for
under hinanden), findes der så nogen anden metode end at bruge display:
table-cell eller evt. at bruge tabeller?

<!-- Div'en, som de andre div'er skal ligge inde i.
De andre div'er skal ligge ved siden af hinanden. -->
<div id='holder'>
<div id='div1'>
</div>

<div id='div2'>
</div>

</div id='div3'>
</div>
</div>

Jeg kan ikke bruge span i ovenstående tilfælde, fordi width så ikke virker.
Absolut positionering kan jeg godt bruge, men det er for ufleksibelt:
Ændrer jeg én værdi ét sted, skal jeg lige pludselig til at ændre en masse
andre steder.

--
Jonas Koch Bentzen

 
 
Jens Gyldenkærne Cla~ (19-11-2002)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 19-11-02 23:30

Jonas Koch Bentzen skrev:

> Hvis man vil have flere div'er placeret ved siden af hinanden
> (frem for under hinanden), findes der så nogen anden metode
> end at bruge display: table-cell eller evt. at bruge tabeller?

Float?
--
Jens Gyldenkærne Clausen
MF (medlem af FIDUSO - www.fiduso.dk)
I ovenstående tekst benyttes nyt komma.

Jonas Koch Bentzen (19-11-2002)
Kommentar
Fra : Jonas Koch Bentzen


Dato : 19-11-02 23:42

Jens Gyldenkærne Clausen wrote:

> Jonas Koch Bentzen skrev:
>
>> Hvis man vil have flere div'er placeret ved siden af hinanden
>> (frem for under hinanden), findes der så nogen anden metode
>> end at bruge display: table-cell eller evt. at bruge tabeller?
>
> Float?

Tak.

float: left på div1 og div2 gør, at det virker.

--
Jonas Koch Bentzen

Jonas Koch Bentzen (20-11-2002)
Kommentar
Fra : Jonas Koch Bentzen


Dato : 20-11-02 00:42

Jonas Koch Bentzen wrote:
>
> float: left på div1 og div2 gør, at det virker.

Men, fandt jeg lige ud af, holder-div'en udvider sig ikke, sådan at den
passer med den samlede størrelse på de tre div'er, den holder. Normalt vil
holder-div'en jo udvide sig og holde de tre div'er, men ikke, når man
bruger float: left på div1 og div2. Hvad kan man gøre ved det?

--
Jonas Koch Bentzen

Jesper Brunholm (20-11-2002)
Kommentar
Fra : Jesper Brunholm


Dato : 20-11-02 10:06

Jonas Koch Bentzen wrote:
> Jonas Koch Bentzen wrote:
>
>>float: left på div1 og div2 gør, at det virker.
>
>
> Men, fandt jeg lige ud af, holder-div'en udvider sig ikke, sådan at den
> passer med den samlede størrelse på de tre div'er, den holder. Normalt vil
> holder-div'en jo udvide sig og holde de tre div'er, men ikke, når man
> bruger float: left på div1 og div2. Hvad kan man gøre ved det?

Et alternativ til float: løsningen kunne være position:absolute.

Jeg har lavet et lille forsøg med det nederst på
<http://www.garion.dk/test/index.html>. Det har ikke noget med det
problem jeg beskriver på siden at gøre

Siden validerer (bortset fra manglende charset - som kan være ligemeget
her) som CSS, så det kan ikke være forkert at undlade en top: - position
(det var jeg lidt i tvivl om om man skal angive).

mvh

Jesper Brunholm


Brian Hjøllund (20-11-2002)
Kommentar
Fra : Brian Hjøllund


Dato : 20-11-02 11:03

>Men, fandt jeg lige ud af, holder-div'en udvider sig ikke, sådan at den
>passer med den samlede størrelse på de tre div'er, den holder. Normalt vil
>holder-div'en jo udvide sig og holde de tre div'er, men ikke, når man
>bruger float: left på div1 og div2. Hvad kan man gøre ved det?

Indsæt en <div> lige efter den sidste div (div2) som har style="clear:
both; height: 1px; overflow: hidden"

/Brian
http://www.hybreed.net

Jens Gyldenkærne Cla~ (20-11-2002)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 20-11-02 01:05

Jonas Koch Bentzen skrev:

>> float: left på div1 og div2 gør, at det virker.
>
> Men, fandt jeg lige ud af, holder-div'en udvider sig ikke,
> sådan at den passer med den samlede størrelse på de tre
> div'er, den holder.

Hjælper det at sætte overflow: auto;? - evt. også width: auto;

Ellers skal du kigge på alternative værdier af display.
--
Jens Gyldenkærne Clausen
MF (medlem af FIDUSO - www.fiduso.dk)
I ovenstående tekst benyttes nyt komma.

Jonas Koch Bentzen (20-11-2002)
Kommentar
Fra : Jonas Koch Bentzen


Dato : 20-11-02 10:48

Jens Gyldenkærne Clausen wrote:

> Jonas Koch Bentzen skrev:
>
>>> float: left på div1 og div2 gør, at det virker.
>>
>> Men, fandt jeg lige ud af, holder-div'en udvider sig ikke,
>> sådan at den passer med den samlede størrelse på de tre
>> div'er, den holder.
>
> Hjælper det at sætte overflow: auto;? - evt. også width: auto;

Kun i Mozilla - ikke i Opera 6 og Konqueror.

--
Jonas Koch Bentzen

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

Månedens bedste
Årets bedste
Sidste års bedste