PDA

View Full Version : How can I get my two divs to go side-by-side if I lost the resize handles in Dreamweaver CC


RedFinch
02-02-2015, 06:16 PM
Hi I'm using dreamweaver CC and have a container div with two other nested divs. I would like for them to be side-by-side. For some reason I don't have the resize handles in dreamweaver cc but I would still like to handle this issue with css. One of the divs is at the bottom left and the orther is at the bottom right. I've spent hours following examples from various forums and finally had to reach out to anyone that may be able to help me. My html and css code snippets are below.


<div id="container" class="fluid ">

<div id="box1" class="fluid ">This is the content for Layout Div Tag "box1"</div>
<div id="box2" class="fluid ">This is the content for Layout Div Tag "box2"</div>

</div>


#container{
display:inline-block;
text-align:left;
border:2px solid #a1a1a1; border-radius:10px; margin:1px; padding:5px;
background-color:#F1F879;


}
#box1{
width:40%;
height:100%;
background-color:#1FEC90;
display:inline-block;
float:right;
vertical-align:top;

}
#box2{
width:40%;
height:100%;
background-color:blue;
display:inline-block;
vertical-align:top;

}

edbr
02-03-2015, 02:58 AM
make the container relatively positioned then its child divs absolutely positioned
<!DOCTYPE HTML>
<html>
<head>
<style>
#container{
height:200px;
position: relative;
text-align:left;
border:2px solid #a1a1a1; border-radius:10px; margin:1px; padding:5px;
background-color:#F1F879;
}
#box1{
width:40%;
position:absolute; top:0; left:0;
background-color:#1FEC90;
display:inline-block;
float:left;
vertical-align:top;
}
#box2{
width:40%;
position:absolute; bottom:0; right:0;
background-color:blue;
display:inline-block;
float:right;
vertical-align:top;

}
</style>
</head>
<body>
<div id="container" class="fluid ">

<div id="box1" class="fluid ">This is the content for Layout Div Tag "box1"</div>
<div id="box2" class="fluid ">This is the content for Layout Div Tag "box2"</div>

</div>
</body>
</html>

RedFinch
02-04-2015, 07:57 PM
Thanks for the help...that totally worked!