html - why can't I get my two divs to sit side by side -

i want able place 2 divs side side, right div text , left 1 picture cant work, tried float them right , left didn't work.

here code

<div id="container">    <div id ="pic">        <img src="img_4847.jpg"alt="me"/>          </div>    <div id ="about">            <h1>about me</h1>    <p>hello name rebekah, i’m 23 , blog </p>    </div>    </div>

#about  {  	  	padding-left: 500px;  	padding-right: 100px;  	padding-top: 60px;    	  	  }    #pic  {  	padding-left: 110px;  	padding-top: 60px;    		  	  }

you need float elements:

#pic should floated left

#pic {     float:left; } 

#about should floated right

#about {     float:right; } 

http://jsfiddle.net/x19wwk9n/

you need # on tag within css file.