WordPress.org

Forums

[resolved] Changing the minimum width of Twenty Eleven. (19 posts)

  1. ransom1337
    Member
    Posted 2 years ago #

    Hello,

    I'm keeping the responsive design of Twenty Eleven, but I want it to respond all the way down to 320px width so that it displays at the correct size on iPhones. When I'm testing it in-browser, it only seems to respond down to about 460px width, yet I can't seem to find a single min-width property for this in the CSS anywhere.

    Can anyone please tell me where I can change this?

    Thanks.

  2. Pioneer Web Design
    Member
    Posted 2 years ago #

    Try a mobile plugin like the very popular wpTouch. A Pro version is available with excellent support for iOS devices.

  3. ransom1337
    Member
    Posted 2 years ago #

    Thanks for the response.

    Is there not just a min-width property I can change?

  4. Pioneer Web Design
    Member
    Posted 2 years ago #

    Widths in TwentyEleven use percentage. How would forcing a min width affect your site on a Mobile Browser?

  5. ransom1337
    Member
    Posted 2 years ago #

    If it's only shrinking to 460px width, that means that when a user opens the page on a mobile, it 'zooms out' to fit everything in. I'd like all my text to display at the sizes I've gone to the trouble of setting rather than making the user zoom in to read the blog.

    And to do that, it needs to respond down to 320px.

    TwentyEleven only uses percentages down to 460px, which is where it seems to have a minimum width attached to it, because it doesn't go any smaller than that. Surely there's a property somewhere I can change to alter this.

  6. Pioneer Web Design
    Member
    Posted 2 years ago #

    TwentyEleven only uses percentages down to 460px

    Can you provide a link that notes this?

    I think that the default media view is landscape and not portrait and that is the issue?

  7. ransom1337
    Member
    Posted 2 years ago #

    Just open any TwentyEleven-themed WordPress blog and shrink your browser down to a thin width. It only scales down to roughly 460px. I'm not sure if that's the exact number.

    The landscape media view might be the issue. Where can I change that please?

  8. Pioneer Web Design
    Member
    Posted 2 years ago #

    Just open any TwentyEleven-themed WordPress blog and shrink your browser down to a thin width. It only scales down to roughly 460px

    I am not seeing this..

    Try Rotating the device to landscape (sideways)or review device settings.

  9. ransom1337
    Member
    Posted 2 years ago #

    You're not seeing it, even on a desktop?

  10. WPyogi
    Forum Moderator
    Posted 2 years ago #

    Have you looked at the twentyeleven style.css file -- at the end where the "responsive" code is?

  11. ransom1337
    Member
    Posted 2 years ago #

    Yes I have. There's no relevant min-width values that I can find.

  12. WPyogi
    Forum Moderator
    Posted 2 years ago #

    What is your site URL?

  13. ransom1337
    Member
    Posted 2 years ago #

    http://bitofageek.com/

    You'll have to login though as:
    username: demo
    password: demopassword

    Open it in a desktop browser and shrink the browser width to see what I mean. It stops at the 460px-ish mark, which is where I assumed a min-width property must have been set.

  14. WPyogi
    Forum Moderator
    Posted 2 years ago #

    You have a "coming soon" page on there -- no login.

  15. Pioneer Web Design
    Member
    Posted 2 years ago #

    You're not seeing it, even on a desktop?

    There is a limit in each browser to how small a page can be re-sized, but it's browser dependent, and is much smaller than 460px wide in major desktop browsers. (But this is re-sizing a page already loaded, which is not the same as loading a page based on device width..to test use a desktop WYSIWYG editor and open a page at say 640 wide and then re-size in browser)

    The @Media CSS attempts to decide how to show the site on devices of differing widths, but is also device/OS/browser dependent.

  16. ransom1337
    Member
    Posted 2 years ago #

    WPyogi: Login via /wp-admin.

    Seacoast: But my portfolio page responds down to 320px no problem in Firefox, and I'm testing this one in Firefox too, so it's not a browser default issue.

  17. ransom1337
    Member
    Posted 2 years ago #

    I've just discovered the cause of the problem, guys - it was the WP toolbar at the top of the page. Sigh.

    Cheers anyway. I'll just find a way to remove that.

  18. WPyogi
    Forum Moderator
    Posted 2 years ago #

    REALLY? You should NEVER, EVER post back-end login info on a forum -- you need to change it now.

  19. ransom1337
    Member
    Posted 2 years ago #

    It was just a Subscriber account. But thanks for the concern! Removed it now, too.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.