Jump to content


Photo
- - - - -

Section sequence control when shrinking to mobile width


Best Answer James B , 19 June 2013 - 11:17 PM

Hi Sheila

 

In the responsive layout the content falls one under the other depending on the order it appears within the html. So for example if you're looking at the html in firebug, and you work down the code on the page you'll see the header code then content, sidebar, footer etc. The mobile layout is created by using css to change the float and width of each of those items so they stack differently from the desktop view. But they are still in the same order, just the display of those items are adjusted.

 

So unfortunately there's no way to change the actual order of the elements on the page, just how they display in the mobile view whilst still in the same order.

Go to the full post


  • Please log in to reply
5 replies to this topic

#1 sheilahoff

sheilahoff

    Advocate

  • Members

  • 335 posts
  • LocationSeattle
  • Framework Version:DMS
  • Country: Country Flag

Posted 19 June 2013 - 04:31 AM

I'm new to PL and also to working with responsive grids. I showed the client how the site looks when displayed on a narrow browser emulating a phone and his first question was can I control the sequence of the info. I have NO idea what is determining that or if there's any way to control it. So obviously the header and nav are first and the footer is last. I would guess the primary body content is next then all the sidebars and footer widgets. But is there any way to influence this at all? If so, how?

 

Thanks,

Sheila



#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 13192 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 19 June 2013 - 12:58 PM

Hi Sheila,

 

What would you like to influence?

Can you provide more information please, including a link to the site in question please.



#3 sheilahoff

sheilahoff

    Advocate

  • Members

  • 335 posts
  • LocationSeattle
  • Framework Version:DMS
  • Country: Country Flag

Posted 19 June 2013 - 01:54 PM

Sorry...it was more a general question as the site is still in the early stages. It's located at

Please Login or Register to see this Hidden Content

. So for instance this homepage has a sidebar that folds in under the photo and main conent. What if we wanted the sidebar content to display prior to the photo and content that's under it? That's the kind of thing. And I assume the 3 MoreFoot will always appear in their order which is likely fine. I think to some extent the client was just asking, going foward, if we have any options to control this. Every page will have a unique sidebar except within the blog post area. THANKS.



#4 James B

James B

    Advocate

  • Moderators
  • 4984 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 19 June 2013 - 11:17 PM   Best Answer

Hi Sheila

 

In the responsive layout the content falls one under the other depending on the order it appears within the html. So for example if you're looking at the html in firebug, and you work down the code on the page you'll see the header code then content, sidebar, footer etc. The mobile layout is created by using css to change the float and width of each of those items so they stack differently from the desktop view. But they are still in the same order, just the display of those items are adjusted.

 

So unfortunately there's no way to change the actual order of the elements on the page, just how they display in the mobile view whilst still in the same order.



#5 sheilahoff

sheilahoff

    Advocate

  • Members

  • 335 posts
  • LocationSeattle
  • Framework Version:DMS
  • Country: Country Flag

Posted 20 June 2013 - 01:36 AM

got it...thanks for the clear explanation.



#6 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 20 June 2013 - 12:59 PM

I'll let James know.  Cheers!