איך ממקמים כמה תיבות בCSS באמצע

יש בעיה שתיבה עולה על תיבה…
תודה, באמת עשיתי את זה…
זה פועל לגבי כמה תיבות בהתחלה, אבל אני מגיע למצב שתיבה אחת עולה על השניה ולא באמת "ממשיכה" אותה בשורה מתחתיה.

צירפתי קוד והנה הסבר:
content  – זה תיבות שהם גוף האתר, TOP זאת התמונה העליונה והBODY זאת תמונה שנמתחת לפי כמות הטקסט.
BOTTOM זה ה"פוטר" התחתון בעצם, שגם שם – TOP מהווה תמונת חיבור והBODY מכיל את הטקסט.
אבל ההבעיה שהTOP של הBOTTOM עולה על אמצע הBODY של הCONTENT ללא סיבה, ולא ממשיך בדיוק איפה שהוא נגמר.
אין לי גם אפשרות לדעת מה יהיה הגובה של הBODY בCONTENT

הנה הקוד:

#content {
    margin:  auto;
    position: absolute;    
}

.content div.top {
   margin: auto;
   padding: 53px 0em 0em 0em;
   display: block;
   background: url(img/topcontent.png) top center no-repeat;
   width: 1026px;
   height: 53px ;
   float: inherit;
}

.content div.body {
   margin: auto;
   display: block;
   background: url(img/body.png) top center repeat;
   width: 1026px;
   float: inherit;    
}

#bottom {
  margin:  auto;
  position: absolute;
}

.bottom div.top {
margin: auto;
padding: 255px 0em 0em 0em;
display: block;
background: url(img/bottom.png) top center no-repeat;
width: 1026px;
height: 255px;
}

.bottom div.body {
margin: auto;
display: block;
background: url(img/legs.jpg) top center repeat;
width: 1026px;
float: inherit;
}

זהו זה…מקווה שהייתי מובן, אני ממש שובר את הראש כבר כמה ימים, תודה!!!!