Place Two Divs Next To Each Other Using CSS - Example
> Here we consider how to Place Two Divs Next To Each Other Using CSS.
> Lets start with one example here.
> Suppose we have two Divs as shown below.
> Here is the style given for these divs.
#firstDiv {
width: 200px;
height:200px;
background-color: yellow;
}
#secondDiv {
width: 200px;
height:200px;
background-color: red;
}
> On RunTime, these two divs looks like as shown below.
> Lets consider how to place these divs next to each other.
Place Two Divs Next To Each Other - Solution
> For placing these two divs next to each other, just give style
float : left.
> Provide
float : left for both Divs.
#firstDiv {
width: 200px;
height:200px;
background-color: yellow;
float : left;
}
#secondDiv {
width: 200px;
height:200px;
background-color: red;
float : left;
}
> Here is the end result of new style.
> By providing
float : left for both Div, we can Place Two Divs Next To Each Other.
Watch Video of this Content on Video Steaming