Help with Divs ?! [Archive]

DJ::Beatz

08-05-2008, 03:13 AM

Ok, im trying to code a layout, but im having trouble with one small part.
http://habblefm.com/images/problem.png
I couldent get the black part on the right to go to the right, so I set margins (which i believe are the problem). The main problem is that the TOP CONTENT area isn't showing (the bg image)!

If it is the margins, how can i keep it to the right, without messing the other parts up?

CODE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TOP SECRET</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="style1.css" />
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#800080">
<table>

<tr>
<td>
<div id="marquee_container">
<div id="marquee">
</div>
</div>
<div id="banner_container">
<div id="banner_rep">BANNER</div>
<div id="banner_bot"></div>
</div>

<div id="banner_container">
<div id="top"></div>
<div id="mid">
<div id="radio_cont">RADIO CONTENT</div>
<div id="radio_cont">Radio dets</div>
</div>
<div id="bot"></div>
</div>
</td>
</tr>
</table>
</BODY>
</HTML>

STYLE SHEET:

body {
text-align: center;
background-color: #ffffff;
}

#container {
width: 853px;
}

#marquee_container {
width: 857px;
}

#main_container {
width: 857px;
}

#top {
background: url(images/main_top.png) repeat-y;
height: 3px;
}

#mid {
background: url(images/main_mid.png) repeat-y;
}

#bot {
background: url(images/main_bot.png) repeat-y;
height: 6px;
}

#marquee {
background: url(images/top_marquee.png) no-repeat;
height: 26px;
}

#banner_rep {
background: url(images/banner_repeat.png) repeat-y;
}

#banner_bot {
background: url(images/banner_bot.png) repeat-y;
height: 3px;
}

#radio_cont {
background: url(images/radio_cont.png) no-repeat;
height: 72px;
margin-left: 538px;

#top_cont {
background: url(images/top_cont.png) no-repeat;
height: 31px;
}

Much Love
,Beatz

P.S. Its the first layout i have coded (partially atm), so it may be a big screw up XD

DJ::Beatz

08-05-2008, 03:19 AM

Lmao, im a mess, i just encounted another problem! I have tabs open atm, and when i swich from the file to a diffrent tab, scroll, then go back, it makes this weird break thing in the banner_bot and top areas.

http://habblefm.com/images/problem2.png

--ss--

08-05-2008, 12:51 PM

Add overflow-hidden to the main container and the div that has the background your trying to put it within ;).
For the gap's i'm guessing it's a padding error so set it to padding: 0px;