CSS issue with a “middle” div that won't wrap its content

Le_Baron

New Member
Here (and below) you can see an issue with a "middle" div that won't wrap its content. I'm trying to get it to automatically wrap the entire content of the table, so there's a neat white 10 pixel padded border all the way round. I've tried everything I can think of, playing with display modes, floats, clears, overflows... But nothing seems to work. Can anyone see where I'm going wrong?\[code\]<!DOCTYPE html><html lang="en"><head> <style type="text/css"> #outer { height : 200px; width : 200px; background : red; overflow : auto; padding : 10px; } #middle { background : white; padding : 10px; } #inner { border : 1px solid purple; } td { background : cyan; padding : 5px; border : 1px solid blue; } </style></head><body> <div id="outer"> <div id="middle"> <table id="inner"> <tr> <td>this is some random text</td> <td>this is some random text</td> <td>this is some random text</td> <td>this is some random text</td> </tr> </table> </div> </div></body></html>\[/code\]
 
Back
Top