I'm having some issues with using a dynamic div adjusting to a static div. At first, I thought it was just IE9 being itself, but, after testing it in Chrome and Firefox, I've come to discover I'm having a bigger issue.What I'm trying to do is have the dynamic div on the left adjust to the static div on the right, but, what I was reading to do using margin-left and margin-right isn't properly handling it.The HTML:\[code\]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta content="text/html; charset=utf-8" http-equiv="Content-Type" /><link href="http://stackoverflow.com/questions/14428583/css/base.css" rel="stylesheet" type="text/css" /></head><body><div class="container"> <div class="Heading">aaaa</div> <div class="CharacterPanel"></div> <div class="content">aaa</div></div></body></html>\[/code\]The CSS:\[code\]div.container {overflow: hidden;width: 100%;height: 100%;body {background-color: #000000;div.Heading {border-top-style: solid;border-width: thin;border-color: #000000;background-color: #808080;width: 100%;height: 45px;float: left;border-right-style: solid;overflow: hidden;margin-left: -151px;}div.content {overflow: auto;border-width: thin;border-color: #000000;width: 100%;height: 500px;float: left;background-color: #808080;border-top-style: solid;border-right-style: solid;margin-left: -151px;display: inline;position: relative;}div.CharacterPanel {border-width: thin;border-color: #000000;float: right;width: 150px;height: 550px;background-color: #808080;border-top-style: solid;text-align: center;margin-left: 0px;margin-right: 0px;}\[/code\]The issue happens on those 3 particular div tags. When viewing the HTML page, the divs fit together, the issue is that since margin-left is set to a negative, it acts as if the entire div tag is shifted to the left 151 pixels, casing all characters up until 151 pixels to go off page into the hidden overflow of container.
Dynamic div adjusting to static div
- Thread starter baloi
- Start date