Avatar billede fab Nybegynder
12. september 2006 - 23:30 Der er 7 kommentarer og
1 løsning

float left uden wraps

Hejsan,

jeg har en stribe <div>'s der ligger ved siden af hinanden, alle med float:left. Det er smukt.

Lad os sige, at mine divs er ca. 300px brede. Jeg vil gerne have, at når jeg sætter f.eks. 10 divs ved siden af hinanden, så "breaker" div'sne ikke eller wrapper ned på næste "linie".

Jeg er ud på at opnå det samme som hvis jeg puttede hver div i hver sin tabel-data (td), som så kan være så lang det skal være ud til højre - og at man så må scrolle derud for at se den - men hvor den altså ikke wrapper ned.

Giver det mening?

Venligst,
Frederik
Avatar billede mclemens Nybegynder
12. september 2006 - 23:50 #1
Sådan ?


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

</head><body>

<div style="width:3000px;">

<div style="width:300px;background:#aaa;float:left;">Test1</div>
<div style="width:300px;background:#aaa;float:left;">Test2</div>
<div style="width:300px;background:#aaa;float:left;">Test3</div>
<div style="width:300px;background:#aaa;float:left;">Test4</div>
<div style="width:300px;background:#aaa;float:left;">Test5</div>
<div style="width:300px;background:#aaa;float:left;">Test6</div>
<div style="width:300px;background:#aaa;float:left;">Test7</div>
<div style="width:300px;background:#aaa;float:left;">Test8</div>
<div style="width:300px;background:#aaa;float:left;">Test9</div>
<div style="width:300px;background:#aaa;float:left;">Test10</div>

</div>

</body></html>
Avatar billede mclemens Nybegynder
12. september 2006 - 23:54 #2
(du er nødt til at have elementet man width at lægge dem i - ellers er alternativet at placere dem via absolute left: 300px ; left:600px; ... - eller definere body elementet til en width istedet for den ekstra div ... eller have tabellen som du selv nævner (en af tabellens styrker)... sidste løsning er så et javascript (ikke så pænt))
Avatar billede mclemens Nybegynder
12. september 2006 - 23:54 #3
(du er nødt til at have elementet man
->
(du er nødt til at have div elementet med
Avatar billede mclemens Nybegynder
13. september 2006 - 10:35 #4
Og et svar ...
Avatar billede fab Nybegynder
13. september 2006 - 20:34 #5
hejsan,

tak for svar - jeg er fræk og kan se, at jeg har glemt at oplyse at jeg ikke kan sætte bredden på "moder" elementet, desværre (der havde jeg selv været). så din løsning fungerer ikke i forhold til det jeg har brug for - men det er selvfølgelig et svar på spørgsmålet, det kan jeg godt se.

nogle andre lyse idéer på hvordan man kan undgå wraps uden at gøre som mclemens første ide ?

venligsta
fabbi
Avatar billede mclemens Nybegynder
13. september 2006 - 20:40 #6
Der er også dem i 12/09-2006 23:54:09 ...?
Avatar billede fab Nybegynder
17. september 2006 - 17:04 #7
heps,

min løsning på udfordringen endte med at være at lave en tabel inde i div'en for således at undgå at sætte fast bredde på div'sne.

ikke fuldstændig tabel løst, men bedre end frames og det validerer fint som XHTML loose.

Tak til mclemens for svar !

FAb
Avatar billede mclemens Nybegynder
17. september 2006 - 18:08 #8
Og tak for point :)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester