Question

Ok this is what I have..

         <section id = "main"><!--main section -->
            <h2> Latest Work... </h2>
            <section class="examples"><a href="#"><img src="images/eg.jpg" alt="example"></a> </section>
            <section class="examples"><a href="#"><img src="images/eg.jpg" alt="example"></a> </section>
        </section><!-- end of main section -->  

Ok now I dont understand how I would line these 3 sections up in one line.. ive tried display: inline-block; etc nothing seems to work. do i need to target the section part in the css file or the img? or both? help! lol thanks 🙂

ok iv managed to do that with all your help.. how would i center them now?

Answer 1

You could try something like this :

​h2, .examples​ {
    float:left;
    margin: 10px;    
    display:block;
}​

You can see it here http://jsfiddle.net/Phenix/Mwtdb/