I have 2 columns on a page, I want left section to take full width in case if 2nd column is not available, but if 2nd column is available it should take only remaining portion at left side.
<div id=”maintext”>some text here of 8 lines in case there is 2nd column available.</div>
<div id=”contactbox”> Our contact here</div>
css
#maintext{
float: left;
width: 583px;
background-color: #f6f6f6;
font-family: “AvantGarde Bk BT”, Tahoma, Verdana, Arial;
font-size: 11px;
color: #373737;
float: left;
margin: 0 0 18px 0;
}
#contactbox{
float: left;
width: 259px;
height: 220px;
background-color: #F6F6F6;
margin: 0 0 0 18px;
}
Problem:
if I do width: auto; it is making it 100%, if I make it display: inline-block its doing same and send right box to next line.
How can I achieve this?
