WordPress.org

Ready to get started?Download WordPress

Forums

How to Create Fluid 'Table' Divs? (3 posts)

  1. EarlSnappy
    Member
    Posted 1 year ago #

    Hi I'm using the 'fluid' twenty eleven theme and am trying to create two columns and two rows that will create a table effect on the page. Each of the 4 divs will have an image and text.

    The css code I've got below works in normal screen size, but when the screen is reduced the alignment e.g. float left goes, and it only looks ok in the the minimum fluid screen width. I've tried - position: attribute, but that doesn't work either. Any ideas? Thanks Earl

    #left {
    text-align: center;
    width: 200px;
    height: 200px;
    float: left;
    margin: 0px 0px 2em 4em;
    position:relative;
    }
    
    #right {
    text-align: center;
    width: 200px;
    height: 200px;
    float: right;
    margin: 0px 0px 2em 4em;
    position:relative;
    }

    [please mark any posted code - http://codex.wordpress.org/Forum_Welcome#Posting_Code ]

  2. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    try and work with width values in %;

    http://www.w3schools.com/cssref/pr_dim_width.asp

    (the same possibly for margins, etc)

    also, better use css classes, if the elements are going to get used more than once on a web page.

    http://www.w3schools.com/css/default.asp

  3. EarlSnappy
    Member
    Posted 1 year ago #

    Thanks alchymyth, am working on a % solution, and if I crack it I'll send you a link and the code, Earl

Topic Closed

This topic has been closed to new replies.

About this Topic