www.webdeveloper.com
Results 1 to 2 of 2

Thread: Floating and clearing five section tags

Hybrid View

  1. #1
    Join Date
    May 2012
    Posts
    79

    Floating and clearing five section tags

    I have five section tags that I would like to float so that they are inline with each other. I have used the float / clearfix technique in the past and it has worked. I cannot figure out what i am doing wrong.

    CSS:
    Code:
        #content{ padding:30px 0 0 15px; width: 959px; }
    
        .clearfix:after {
        content: ".";
        display: block;
        clear: both;
        visibility: hidden;
        line-height: 0;
        height: 0;
    }
    
        .clearfix {
        display: inline-block;
    }
    
         html[xmlns] .clearfix {
        display: block;
    }
    
        *html .clearfix {
        height: 1%;
    }
    
    #1, #2, #3, #4, #5 {padding-right:15px; float: left;}

    HTML:
    Code:
       <div id="content">      
          <section id="1">
            <img src="1.png" />
          </section>
    
          <section id="2">
            <img src="2.png" />
          </section>
    
          <section id="3">
            <img src="3.png" />
          </section>
    
          <section id="4">
            <img src="4.png" />
          </section>
    
          <section id="5">
            <img src="5.png" />
          </section>
    
         </div><!-- end content-->
    
          <div class="clearfix"></div>

  2. #2
    Join Date
    May 2012
    Posts
    79
    unbelievable 2 hours spent and it was not working because of a misspelled word!!!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles