Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7

Thread: The Clear Tag??

  1. #1
    Regular Coder
    Join Date
    Jan 2007
    Posts
    134
    Thanks
    0
    Thanked 0 Times in 0 Posts

    The Clear Tag??

    Im looking a simple, brain dead guide to the clear div. The one that sets each column the same one as the longest. Is simply a matter of having the coding in the style and then the div in the body. Similiar to forming a column. Im confused because I dont understand the coding and I have also seen one method that involves images.

    If you had columns to set the same length what code do you use?

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    Regular Coder
    Join Date
    Jan 2007
    Posts
    134
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ive read this and I dont understand it!!

  • #4
    Regular Coder Graft-Creative's Avatar
    Join Date
    Aug 2004
    Location
    Web Designer - North East Lancashire U.K.
    Posts
    842
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Faking equal height columns

    Quote Originally Posted by Powered View Post
    Ive read this and I dont understand it!!
    Basically it's just faking it by using a vertically tiled background image.

    Here's another approach (along with a simple explanation) from coding forums member Excavator:

    equal length columns

    Hope that helps,

    Gary

  • #5
    Regular Coder
    Join Date
    Jan 2007
    Posts
    213
    Thanks
    0
    Thanked 0 Times in 0 Posts
    the faux columns page is good but it does go on a bit and doesn't explain the clear CSS attribute correctly.

    I have a website somewhere which explains it in depth i will find it when i get home
    Matthew Bagley
    Paramiliar Design Studios
    Website Design | Website Development | Search Engine Optimisation (SEO)

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,616
    Thanks
    0
    Thanked 645 Times in 635 Posts
    All clear does is to make sure that the cleared element does not appear next to a floated element contained within the same container.

    <div id="c">
    <div id="c1" style="float:left">some content</div>
    <div id="c2">some more content</div>
    <div id="c3" style="clear:left">content to go under c1</div>
    </div>

    With this code the content in c1 will be floated left and the content of c2 will be placed to the right of it wrapping around under it if it is long enough. Regardless of whether he c2 content goes as far down as the c1 content the c3 content will go under it because it has been told to go clear of any floated left content.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #7
    Regular Coder
    Join Date
    Jan 2007
    Posts
    134
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I see, Im using the overflow: auto; div in my last column, in IE it appears the same length as the column but in Firefox it doesn't work at all.


  •  

    Posting Permissions

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