[allstars]

Originally posted by crazzy@Aug 16 2007, 19:41

Hurdant utseende önskar du?
vilken bredd på hela sidan och vilka bredder på leftPadding, center och right?

<style type="text/css">
#barn {position:relative; top:100px; left:150px;} /* alltså - relaterat till föräldern */
</style>
<div id="foralder">
 <div id="barn">
innehåll
 </div>
</div>

[Aerpe]

http://arloo.blogspot.com/2005/11/cs...ps-tricks.html

Länk samling till CSS lösningar och exempel.

[crazzy]

jag hade tänkt mej att ha överst en header med 720 i bredd centrerad och 150 hög..
under den en meny som e 66 hög och så bred det behövs och centrerad..
under den ska jag ha 5 divar på samma rad..
varav två 160 breda och en 360... variabel höjd...
leftpadding och rightpadding ska ligga utanför dessa och täcka upp överblivet utrymme..
och nederst en footer...

[KarlRoos]

Det är inte svårt att fixa.
Vad sägs om att lära dig lite CSS och Divs och sedan skriva ihop det där.

Lycka till

[crazzy]

det enda jag har problem med är att få en div att fylla ut allt tillgängligt utrymme

edit:

det verkar nämligen inte funka med att sätta width till auto

[crazzy]

så här tänkte jag ha det..

#LeftMargin och #RightMargin ska ligga på var sin sida och ta upp massa utrymme som blir över... #LeftMargin tar för tillfället inte upp nån yta alls??

[crazzy]

äh jag skiter i dom här förbannade divarna och håller mej till tabellerna som FUNKAR för det gör fanimej inte divarna.....

[KarlRoos]

Du, det är nog bara du som inte förstår det

[Mortekai]

Ta bort leftmargin och rightmargin och lägg en div runt calendar, maincontent och google som du centrerar och sen ger önskvärd bredd om dessa två områden ska vara tomma.

[HMH]

En torrkodad förtydling av vad Mortekai sa... som även visar hur du centrerar (tricket är att både använda text-align:center och margin:auto).

html:

<div id="Header"></div>
<div id="MainMenu"></div>
<div id="ContentArea">
  <div id="Calendar"></div>
  <div id="MainContent"></div>
  <div id="Google"></div>
</div>
<div id="Footer"></div>

css:

body {
  text-align: center;
}
body div {
  text-align: left;
  margin: 0;
}
#ContentArea {
  width: 680px;
  margin: 0 auto;
}
#MainContent {
  width: 360px;
  float: left;
}
#Calendar,
#Google {
  width: 160px;
  float: left;
}
#Footer {
  clear: both;
}