i have two div elements that float on both sides (Left And Right). i applied hr tag after closing the first div tag (That floats left) and before opening the next div tag (That floats right). But the hr tag is displayed at the top background. To see the hr tag, see the small connecting line between the two divs (At the top).
<!DOCTYPE html> <html> <head> <title></title> <style> .leftmovie { border: solid; float: left; width: 47%; margin-left: 2em; height: 400px; } .rightmovie { border:solid; float: right; width: 47%; margin-right:2em; height:400px; } </style> </head> <body> <div class="Row"> <div class="leftmovie"> <span class="Star">ergjkh<br>kdjnkj</span> </div> <div class="rightmovie">legnlejgn<br>gegerge</div> </div> <hr> <div class="Row"> <div class="leftmovie"> <span class="Star">ergjkh<br>kdjnkj</span> </div> <div class="rightmovie">legnlejgn<br>gegerge</div> </div> </body> </html>
Because you don't use clear: both after applying float property.
clear: both
float
Add this in hr tag.
hr
hr { display: inline-block; width: 100%; }
1.4m articles
1.4m replys
5 comments
57.0k users
