div i div

HTML & CSS

16 svar · 470 visningar · startad av Andy 11 okt. 2002

AndyMedlem sedan sep. 2001138 inlägg

Frågan11 okt. 2002 09:06#1

Har en kod som ser ut så här, något förenklat:

</div>

"maindiv" är absolut positionerad, med värdena top: 200px och left: 200px. "leftdiv" skall ligga till vänster i "maindiv"-lagret, och "rightdiv" till höger. Att få leftdiv att ligga till vänster är ju inga problem - det gör den ju automatiskt. men "rightdiv" hamnar under "leftdiv" när jag tittar på sidan i browsern.

Sätter jag top:0px på "rightdiv" så hamnar lagret högst upp i browserfönstret. Jag vill ju att den skall hamna 0 pixlar från kanten på "maindiv"-lagret.

Hur löser jag problemet.

Jag vill helt enkelt att "leftdiv" och "rightdiv" skall ligga bredvid varandra inuti "maindiv".

DOCTYPE är XHTML 1.0 Transitional.

DinoMedlem sedan sep. 20011 914 inlägg

11 okt. 2002 09:15#2

<html>
<head>
<title>Untitled</title>
</head>
<body>
<div style="width: 400px; height: 400px;top: 200px;left: 200px;background-color: red;" id="maindiv"> 
<div style="width: 100px; height: 100px;display: inline; background-color: blue;" id="leftdiv"> 
</div> 
<div style="width: 100px; height: 100px;display: inline; background-color: green;" id="rightdiv"> 
</div> 
</div> 
</body>
</html>

OlleBoopMedlem sedan feb. 20001 861 inlägg

11 okt. 2002 09:33#3

Prova med

float: left

på både #leftdiv & #rightdiv

AndyMedlem sedan sep. 2001138 inlägg

11 okt. 2002 11:15#4

Tack Dino. Det fungerade. MEN... om jag sedan lägger in en div i till exempel "leftdiv" så fungerar det inte längre. måste jag sätta något attribut på den diven också?

DinoMedlem sedan sep. 20011 914 inlägg

11 okt. 2002 11:22#5

Eftersom div är ett block element så måste du sätt display: inline för att får det till ett inline element.

AndyMedlem sedan sep. 2001138 inlägg

11 okt. 2002 11:37#6

Så alla divar som ligger i "leftdiv" eller "rightdiv" måste även de ha display: inline ?

Om jag lägger in en <br /> i t ex "leftdiv" så blir det också fel. Då lägger sig rightdiv under leftdiv.

*suck*

DinoMedlem sedan sep. 20011 914 inlägg

11 okt. 2002 11:47#7

Jo, men jag förstår inte varför du skall ha en massa divar.

AndyMedlem sedan sep. 2001138 inlägg

11 okt. 2002 11:48#8

Varje "element" på sidan lägger jag i en egen div. Jag tänkte undvika tabeller så mycket det går, och istället köra på CSS.

DinoMedlem sedan sep. 20011 914 inlägg

11 okt. 2002 12:14#9

Du har ju span annars.

KoplikMedlem sedan juli 20011 129 inlägg

11 okt. 2002 12:16#10

Kan du inte köra med Tabeller i maindiv:en ?
Varför vill du inte köra med tabeller, du kan ju köra med CSS i tabellerna. Eller har jag missat något?

AndyMedlem sedan sep. 2001138 inlägg

11 okt. 2002 13:24#11

Jo, det är klart att jag kan köra med tabeller. Ville bara testa om det var möjligt att göra det utan tabeller... :) Men nu har jag valt en kombination av tabeller och divar istället.

RiriMedlem sedan dec. 2000182 inlägg

15 okt. 2002 07:29#12

utan tabeller

Hær ær en sida jag gjort utan en enda tabell rackare!
http://www.rational-reducer.com/display.asp
Det går faktiskt riktigt bra!

Nexus86Medlem sedan okt. 20023 030 inlägg

16 okt. 2002 07:56#13

Men tabeller är mycket bättre på det sättet att om något verktyg saknas i webbläsaren dina besökare använder så kommer kanske inte div-arna hamna rätt.

Web-TorMedlem sedan nov. 200013 890 inlägg

16 okt. 2002 08:00#14

Vad menar du med: "om något verktyg saknas i webbläsaren" :q

mikkeXMedlem sedan aug. 2002477 inlägg

16 okt. 2002 08:17#15

Nexus86 skrev:

Men tabeller är mycket bättre på det sättet att om något verktyg saknas i webbläsaren dina besökare använder så kommer kanske inte div-arna hamna rätt.

Vad?

Skippa tabeller, skapa layouter med stylesheets. Det är en tröskel, men när den väl är passerad så är du glad att du slipper dina tabeller i all framtid.

Denniz PoPMedlem sedan aug. 2002207 inlägg

16 okt. 2002 10:01#16

Koplik skrev:

Kan du inte köra med Tabeller i maindiv:en ?
Varför vill du inte köra med tabeller, du kan ju köra med CSS i tabellerna. Eller har jag missat något?

Tja, så småningom (eller gäller det redan nu?) så kommer det att vara felaktigt kodat om man försöker att formatera utseendet på sidan med hjälp av tabeller. Tabeller skall användas till att visa text i tabellformat, _inget_ annat.

_Allt_ som har med utseende att göra skall fixas med css. Lika bra att lära sig det nu, så man kan det när det kommer börja gälla.

jarvkloMedlem sedan juli 20013 378 inlägg

18 okt. 2002 13:35#17

Tja, så småningom (eller gäller det redan nu?) så kommer det att vara felaktigt kodat om man försöker att formatera utseendet på sidan med hjälp av tabeller.

Eh...
Är det xhtml du syftar på så är tabeller fortfarande högst tillåtna vad avser kodning av både layouter och innehåll...
Tabeller kommer inte att tas bort ur HTML eller XHTML (de finns kvar i sin nuvarande form även i de första utkasten till XHTML 2.0) - så vill man använda tabeller för layout så kan man.

Så länge du håller dig till sidor som bara skall visas i en webbläsare är det också kodmässigt korrekt, och ibland även mycket praktiskt att göra tabellbaserade layouter...

Däremot är det antagligen användbarhetsmässigt "felaktigt" på så sätt att man då riskerar att stänga ute surfare med funktionshinder från att kunna tillgodogöra sig innehållet på sidorna...
Möjligen bryter man då därigenom också mot ett eller annat Amerikanskt federalt påbud... men bara om man är en Amerikansk myndighet ;)

Och visst kan det möjligen vara användbarhetsmässigt "bättre" att inte göra layouterna med tabeller... Med risk att stänga ute surfare med "gamla NN4" och en och annan kraschande version av "gamla IE4" istället
Men det är en annan historia ;)

En liten fundering till nu när jag ändå är inne och är besvärlig ;)

_Allt_ som har med utseende att göra skall fixas med css. Lika bra att lära sig det nu, så man kan det när det kommer börja gälla.

Jag skulle nog vilja formulera om det där lite... och säga ungefär som W3C gör i de senaste HTML-specifikationerna - nämligen att:
_Allt_ som har med utseende att göra BÖR fixas med css. Lika bra att lära sig det nu.

Men gör det för att det ger dig många fler möjligheter att göra snygga sidor - inte för att du "måste"

:birp