Page is a not externally linkable
- Code, Content, and Presentation
-- CSS
---- DIV - how to stretch to auto fill empty area?


esso82 - 12:02 am on Jan 28, 2012 (gmt 0)


guys, thank you for replies, I'll show you what exactly I ment, but I presume I will need to reconsider using DIVs in such cases ... should I rather use table instead? ... I mean ... use the DIV to contain whole menu area and then use table or list on the left side and just another DIV inside on right side? ... but anyway .. not having my problem in mind .. is it possible to make a DIV which fills an area with unknown width between left floating and right floating DIV?

and here is my code and a pic to describe what I mean:

[img818.imageshack.us ]

source code from a .php file

echo "<div style='float:left; font-size:15px; line-height:30px; background-color:#000000'><a href='#' class='mm'><span style='margin-left:2px; margin-right:25px'>ROUTES</span></a></div>";
echo "<div class='mmleft'><a href='#' class='mm'><span class='mm'>ARCHIVE</span></a></div>";
echo "<div class='mmleft'><a href='#' class='mm'><span class='mm'>QA</span></a></div>";
echo "<div class='mmleft'><a href='#' class='mm'><span class='mm'>MAINTENANCE</span></a></div>";
echo "<div class='mmright'><a href='#' class='mm'><span class='mm'>STATISTICS</span></a></div>";
echo "<div class='mmright' style='height:30px'>I want this area filled in with black color with no text inside</div>";


and the necessary piece from .css file:

DIV.mmleft {
font-size: 15px;
line-height: 30px;
float: left;
background-color: #000000;
margin-left: 1px;
}

span.mm {
margin-left: 20px;
margin-right: 20px;
}

DIV.mmright {
font-size: 15px;
line-height: 30px;
float: right;
background-color: #000000;
margin-left: 1px;
}

a.mm {
color: #0000ff;
text-decoration: none;
}

a:hover.mm {
color: #ff0000;
text-decoration: none;
}


also ... is it correct method to use the same name of class for say DIV and span as I've used?


Thread source:: http://www.webmasterworld.com/css/4411613.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com