After reviewing solutions provided in an answer to a previous question, I attempted to implement a line border within a div nested inside another div.
Unfortunately, this implementation caused the div to become distorted. Why did this happen?
Markup:
<div id="outer">
<div id="chart"></div>
<div id="table"></div>
</div>
CSS:
#outer{
width: 1300px;
height: 640px;
border: 1px solid black;
}
#chart{
float:left;
width: 900px;
height: 100%;
left:0;
background-color: red;
}
#table{
float:right;
width: 400px;
height: 100%;
right:400;
background-color: yellow;
border: 1px solid back;
}