Div moving a div when item added

evil09 · Mar 18, 2013

I have a container div and 2 div's that should be the same height. #Sidebar div goes on the left where as #Content div should be to the rightwhenever I add something to Sidebar it pushes down the content Div and am kind of stumped \[code\] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>View Applicants</title><style type ="text/css">li{display:inline;background-color: #c5e8cf;}a.menu:link {color: #2b2f2c;}a.menu:visited {color: #2b2f2c;}a.menu:hover {background-color: #dde504;}a.side { border-bottom: 2px solid black; background-color: #e3e7ec; }a.side:link {color: #2b2f2c;}a.side:visited {color: #2b2f2c;}a.side:hover {background-color: #dde504;}label.side {width: 131px; display:inline-block; font-size: 20px; background-color: #e3e7ec; border-bottom: 2px solid black; padding-bottom: 20px; }label.side:hover { background-color: #dde504;}div#header { position: float; background-image: url("../images/header.jpg"); background-repeat: no-repeat; border-bottom: solid 1px #999999; height: 97px; Width: 1000px; margin-left: 114px; margin-top: 10px; background-size: 100%;}div#menu { position: float; border-left: solid 1px #999999;border-right: solid 1px #999999;border-bottom: solid 1px #999999;Width: 998px; margin-left: 115px;padding-top:5px;background-color: #e3f6ea;}#menu-content { margin: auto;width:100%;background-color: #c5e8cf;}div#container{border-left: solid 1px #999999;border-right: solid 1px #999999;border-bottom: solid 1px #999999;Width: 998px;margin-top:3px;margin-left:115px;height: auto;overflow: hidden;}div#sidebar { position: relative;border:2px solid #999999;Width: 131px;padding-bottom: 1000px;margin-bottom: -1000px;background-color: #c5cfd9;overflow: hidden;}div#content {position: relative;padding-bottom: 1000px;margin-bottom: -1000px;border-left: solid 1px #999999;top: -65px;left: 132px;background-color: #f6f4f4;}div#footer { position: relative; border: solid 2px #999999; width: 996px; height: 50px; background-color: #FFFFFF; margin-left: 115px;}#body { background-color: #6b86a3;}</style></head><body id = "body" ><div id="header"> </div><div id = "menu"> <div id="menu-content"><ul> <li style="margin-left:275px;" class="link"><a class="menu" href="http://stackoverflow.com/index.php" >Home</a></li> <li ><a class="menu" href="http://stackoverflow.com/images/header/jpeg" >View Applicant</a> </li> <li><a class="menu" href="http://stackoverflow.com/questions/images/header.jpg">View Applicants</a></li> </ul></div></div> <div id="container" > <div id="sidebar"> <a class="side" href="http://stackoverflow.com/questions/15485017/#"><label class = "side"> Testing sidebar </label></a> <a class="side" href="http://stackoverflow.com/questions/15485017/#"><label class = "side"> Testing sidebar </label></a> </div> <div id="content"></div></div><div id ="footer"> </div></body></html>\[/code\]slightly new to css. Thank you

Div moving a div when item added

evil09

New Member