How do I edit the responsive layout for Twenty Eleven theme

• 

  memoriesofniagara · Member · Jan 11, 2012 at 9:55 pm

  • Copy link
  • Add topic to favorites

  I’m working with the Twenty Eleven theme for a blog, it is going to be displayed in a museum on a a lovely 20″ touch screen, and although the theme has been designed to be responsive for smaller screens it doesn’t seem to do the same for large ones.

  My guess is that I need to edit this line <meta name=”viewport” content=”width=device-width” /> (line 16 in the source view) but I’m not sure what to change it to, I assumed that the “width=device-width” line would be responsive to large and small screens but it does not seem to be.

  Thanks in advance for your help!
  Heather (Memories of Niagara)

  The blog I need help with is: (visible only to logged in users)

• 

  designsimply · Member · Jan 11, 2012 at 10:02 pm

  • Copy link

  The #page element in the Twenty Eleven theme is designed with a max-width of 1000px. A max-width like that is usually added to web designs to keep them from stretching content way too far and therefore making text difficult to read.

  So to make the theme wider, you might need to make a few adjustments and you might start by adjusting the #page { max-width: 1000px; } rule.

• 

  memoriesofniagara · Member · Jan 12, 2012 at 4:22 pm

  • Copy link

  Thanks so much I’ll give it a try!

• 

  memoriesofniagara · Member · Jan 12, 2012 at 4:52 pm

  • Copy link

  Thank you it worked!

• 

  designsimply · Member · Jan 12, 2012 at 6:00 pm

  • Copy link

  Nice! :)