Skip navigation
Currently Being Moderated

Responsive Design/Grid Question

Jun 25, 2012 9:37 AM

I'm using the fluid grid design, and my mobile layout has 5 columns, and some DIVS added - see below:

 

Capture1.JPG

 

I'm trying to get my "LEFT PANE" using 2 columns, and my "RIGHT PANE" using 3 columns to the right of the left pane. You can see they are side by side above, but the right pane only takes up 2 columns.

 

As soon as I make the RIGHT COLUMN stretch to 3 columns, it moves it down below the left column, like below:

 

Capture2.JPG

 

What am I doing wrong? Any help/tips/direction appreciated!

 

Thanks!

 
Replies
  • Currently Being Moderated
    Jun 25, 2012 11:14 AM   in reply to dstoltz007

    Offhand, I'd say you're not keeping your LayoutDivs inside the GridContainer Div.  And your floated LayoutDivs are too wide to fit on the same row. There should be some gutter space between them. See screenshot below:

     

    CS6FluidGrid.jpg

     

    Nancy O.

    Alt-Web Design & Publishing

    Web | Graphics | Print | Media  Specialists 

    http://alt-web.com/

     
    |
    Mark as:
  • Currently Being Moderated
    Jun 27, 2012 10:39 AM   in reply to dstoltz007

    Why don't you start over with a new fluid grid layout and try changing your primary settings a bit?  I like to work with even numbers of columns. 

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jun 27, 2012 12:17 PM   in reply to dstoltz007

    I've been using CSS Media Queries (although not fluid) for some time now.  I don't see any upside in maintaining separate web sites for Desktops/Laptops & Mobiles, do you?

     

    Nancy O.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points