html - Main div isn't expanding vertically -

I have a problem that I can not solve I want to set my main partition to stand, when its The baby is filled with div material but can not make it when I add the lorem text to the left div, it spreads out of its original width in the text, but the main division is not expanding. How can I solve that problem?

HTML

  & lt ;! DOCTYPE html & gt; & Lt; Html & gt; & Lt; Top & gt; & Lt; Title & gt; & Lt; / Title & gt; & Lt; Link rel = "stylesheet" href = "index.css" & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "main" & gt; & Lt; Div id = "left" & gt; & Lt; / Div & gt; & Lt; Div id = "middle" & gt; & Lt; / Div & gt; & Lt; Div id = "right" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Body & gt; & Lt; / Html & gt;  

CSS

  #main {background-color: # ff8f79; Width: 900px; Minute-height: 400px; Margin: 0 auto; Status: Relative; } # Left {status: relative; Width: 300px; Minute-height: 300px; Swim left; Background color: blue; } #middle {width: 300px; Height: 300px; Swim left; Background color: green; } #wright {width: 300px; Height: 300px; Swim left; Background color: black; }  

Add it to the CSS

  # left , #mildle, #right {word-wrap: break-word; }  

Keeps all the text within each individual box and they expand and main also extend