...

View Full Version : Expandable box



The_Return
12-23-2009, 05:25 AM
I'm trying to create a box that expands from width or content only so I have a the left shadow, the middle bg that will repeat x and right shadow whats the best way to do this so it stays browser friendly

My css

#layout_canvas {
background: #FFF url(<?php echo $vars['url']; ?>mod/violoa/graphics/background/content_bg.gif) repeat-x;
margin:0 0 20px 0;
min-height: 558px;
}

#layout_canvas div.topleft {
display: block;
background: url(<?php echo $vars['url']; ?>mod/violoa/graphics/background/content_left.gif) top left no-repeat;
padding: 2.0em 0em 0em 2.0em;
height: 558px;
}

#layout_canvas div.topright {
display: block;
background: url(<?php echo $vars['url']; ?>mod/violoa/graphics/background/content_right.gif) top right no-repeat;
padding: 2.0em;
margin: -2.0em 0 0 2.0em;
height: 558px;
}

#layout_canvas div.bottomleft {
display: block;
height: 45px;
margin-top: -2.0em;
}

#layout_canvas div.bottomright {
display: block;
height: 45px;
margin-left: 3.0em;
}


html


<!-- canvas -->
<div id="layout_canvas">
<div class="topleft">
<div class="topright">
</div>
<?php echo $vars['body']; ?>
</div>
<div class="clearfloat"></div>
</div><!-- /#layout_canvas -->

The_Return
12-23-2009, 03:31 PM
Ok got further the problem now is it pushes the content to the bottom you can see here http://violoa.com/



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum