defining a class within an id in css

I have the following HTML

<div id="footer">
<div class="content">
<div id="first column">
<h1> Hello </h1>

</div>
</div>
</div>

The ID footer contains the background for the footer, however i do not want all the text right next to the edge, and there will be a lot of text in the footer as well as image so i made a class for the other divs that i will creating to ensure they stay within a certain 'box'.

I am struggling to understand how I would define this in CSS. I am sure i will need to mention the id footer as well as the class content. however i tried footer.content { } and footer#content {} but neither work and i cant find any info on the internet.:p

#footer .content{

}

That should point the class .content only within the div with the id="footer". is this what you want?

that seems to be working. however i have the CSS as

#footer .content {
width:90%;
left:5%;
}

This is in order to center the class as the text is touching the side of the box. But this has not worked, the width at 90% is working but not the left 5%? Sorry i am not making much sense.

Use margin-left:5%;
Or if you need to center the text, use text-align:center;