SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2004
    Location
    Canterbury
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    2 columns with CSS

    I have a new design that calls for text to be displayed inside 2 boxes (done this with CSS and a combination of techniques like sliding doors etc). However if I add more text to either box then the height of that box is no longer equal to the other text box and the design doesnt look too good any more.

    So is there any way with CSS to have the text displayed in 2 columns that are of equal height?
    Sharing knowledge saves valuable time!

    Simon

  2. #2
    SitePoint Evangelist
    Join Date
    May 2004
    Posts
    512
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is a very simple but nice trick: fauxcolumns

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,467
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Have a look at my reply in this thread that asks the same question

    http://www.sitepoint.com/forums/showthread.php?t=208666

    Paul
    Edit:


    Beaten by pixelcop But one of my layouts does it without images (But I'd still recommend the image technique as its easier to manage). I just wish they wouldn't give names to these things as though they have just been invented

  4. #4
    SitePoint Enthusiast
    Join Date
    Jul 2004
    Location
    Canterbury
    Posts
    28
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Those are great links!

    However I'm still stuck trying to give my <div>s rounded corners while keeping both 'text boxes' the same size.

    In an ideal world I would like to have just 1 text area and automatically have it flow into the next one when the text requires it... but I guess that's something for CSS 3?
    Sharing knowledge saves valuable time!

    Simon

  5. #5
    SitePoint Evangelist
    Join Date
    May 2004
    Posts
    512
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,467
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    In an ideal world I would like to have just 1 text area and automatically have it flow into the next one when the text requires it... but I guess that's something for CSS 3?
    Yes you'll have to wait for that

    However I'm still stuck trying to give my <div>s rounded corners while keeping both 'text boxes' the same size
    If you have fixed width columns then its just a matter of making one long image to cover both columns with all the top corners in one image and all the bottom corners in another image.

    You place the top at the top and the bottom image goes after the clearing div at the bottom of the columns and can be dragged into position with negative margins. Its quite straight forward but does rely on having fixed with columns.

    Paul


Bookmarks

Posting Permissions

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