How to make two divs fit a desired width and avoid wrapping and overlapping?

Summerrrrrrrrrr

New Member
I'm using relative widths:\[code\]<style> #ldiv { height: 400px; width: 75%; background-color:#fff; color:#ccc; border: 1px solid #F2F2F2; float: left; } #rdiv { vertical-align: top; float: left; width: 25%; }</style><div> <div id="ldiv">Left</div> <div id="rdiv">Right</div></div>\[/code\]With this code, \[code\]#rdiv\[/code\] doesn't stay beside \[code\]#ldiv\[/code\].If I use \[code\]margin-right: -2px;\[/code\] in \[code\]#ldiv\[/code\], the two divs stay side by side, but overlap slightly.I know the problem is caused by the border, but how can I make it fit?
 
Top