smeshy123
11-02-2007, 06:26 AM
I'm trying to sit two divs next to each other, but I can't float one because then my background in my main div will not move down with the content...I think this is better shown:
<div id="wrapper">
<div id="container">
<div id="header">
<div id="logo_float">
<?php
if ($logo) {
print '<img src="'. check_url($logo) . '" alt="'. $site_title .'" id="logo" />';
}
?>
</div>
<?php print $top_bar_links; ?>
</div>
<div id="body">
<div class="top_left_round"><div class="top_right_round"></div></div>
<div id="main">
<div id="left">
<?php if ($tabs) { print $tabs; } ?>
<?php if (isset($tabs2)): print $tabs2; endif; ?>
<?php if ($help): print $help; endif; ?>
<?php if ($messages): print $messages; endif; ?>
<?php print $content; ?>
</div>
<div id="right">afasfsd
</div>
</div>
<div class="bottom_left_round"><div class="bottom_right_round"></div></div>
</div>
</div>
</div>
and the css:
#body {
background: #fff;
width: 1000px;
position: relative;
}
#body .top_left_round {
background: transparent url(images/bodytopleft.png) no-repeat;
position: relative;
width: 8px;
height: 8px;
}
#body .top_left_round .top_right_round {
background: transparent url(images/bodytopright.png) no-repeat;
position: relative;
left: 992px;
width: 8px;
height: 8px;
}
#body .bottom_left_round {
background: transparent url(images/bodybottomleft.png) no-repeat;
position: relative;
width: 8px;
height: 8px;
}
#body .bottom_left_round .bottom_right_round {
background: transparent url(images/bodybottomright.png) no-repeat;
position: relative;
left: 992px;
width: 8px;
height: 8px;
}
#body #main {
position: relative;
padding-left: 10px;
padding-right: 10px;
height: 100%;
}
#body #main #left {
position: relative;
height: 100%;
width: 600px;
}
#body #main #right {
position: relative;
height: 100%;
}
Any help would be greatly appreciated! I'm trying to set the two divs next to each other.
Thanks,
Smeshy
<div id="wrapper">
<div id="container">
<div id="header">
<div id="logo_float">
<?php
if ($logo) {
print '<img src="'. check_url($logo) . '" alt="'. $site_title .'" id="logo" />';
}
?>
</div>
<?php print $top_bar_links; ?>
</div>
<div id="body">
<div class="top_left_round"><div class="top_right_round"></div></div>
<div id="main">
<div id="left">
<?php if ($tabs) { print $tabs; } ?>
<?php if (isset($tabs2)): print $tabs2; endif; ?>
<?php if ($help): print $help; endif; ?>
<?php if ($messages): print $messages; endif; ?>
<?php print $content; ?>
</div>
<div id="right">afasfsd
</div>
</div>
<div class="bottom_left_round"><div class="bottom_right_round"></div></div>
</div>
</div>
</div>
and the css:
#body {
background: #fff;
width: 1000px;
position: relative;
}
#body .top_left_round {
background: transparent url(images/bodytopleft.png) no-repeat;
position: relative;
width: 8px;
height: 8px;
}
#body .top_left_round .top_right_round {
background: transparent url(images/bodytopright.png) no-repeat;
position: relative;
left: 992px;
width: 8px;
height: 8px;
}
#body .bottom_left_round {
background: transparent url(images/bodybottomleft.png) no-repeat;
position: relative;
width: 8px;
height: 8px;
}
#body .bottom_left_round .bottom_right_round {
background: transparent url(images/bodybottomright.png) no-repeat;
position: relative;
left: 992px;
width: 8px;
height: 8px;
}
#body #main {
position: relative;
padding-left: 10px;
padding-right: 10px;
height: 100%;
}
#body #main #left {
position: relative;
height: 100%;
width: 600px;
}
#body #main #right {
position: relative;
height: 100%;
}
Any help would be greatly appreciated! I'm trying to set the two divs next to each other.
Thanks,
Smeshy