SitePoint Sponsor

User Tag List

Results 1 to 13 of 13

Thread: Width Control

  1. #1
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    638
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Width Control

    SitePont Members,
    I was in an Apple store visiting mywebsite on Safari On a 27" monitor and my site came up fine. Ten minutes before I was in BestBuy on Safari On a 27" monitor and my site came up hyperstretched so each paragraph was only 2 lines vertically. I guess the difference was versions of Safari. How do I fix this.

    For <Body> I have
    body{line-height:1.15;font-family:arial,sans-serif;font-size:105%;margin:0;padding:4%}
    Is there max width controll in CSS?

    Thanks,


    Chris

  2. #2
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,620
    Mentioned
    65 Post(s)
    Tagged
    2 Thread(s)
    Chris, please post a link to your site and ideally screenshots of the hyperstretched and normal views so we know what we're looking for.

    Did you happen to note the versions of Safari being used on the demo systems?

  3. #3
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    638
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I can't get you the screen shot of the hyperstretched rendering, I saw it in a store. I don't know what version(s) of Safari I was on. I might have to go back, although I got a feeling both were on the same version.the version in the stare . The subject of my site has nothing to do with programming, so how do I post a link without google finding it?

    Thanks

  4. #4
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,620
    Mentioned
    65 Post(s)
    Tagged
    2 Thread(s)
    Longhand?

    www dot mysite anotherdot com (or some such scheme)

    We can work with that as long as a login and password are not required.

  5. #5
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Chris77 View Post
    The subject of my site has nothing to do with programming, so how do I post a link without google finding it?
    Google ignores links in this forum anyway, as they are all no-follow. So there's no danger from an SEO point of view posting it here. (Not that I think there's be an issue even if the links were do-follow. Linking is not a sin! It's the nature of the web. It's just doing lots of if for no good reason that could be a problem.)

  6. #6
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    638
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Ok the site is actualcures.com.

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Chris77 View Post
    Is there max width controll in CSS?
    Yes indeed. You can do something like this:

    Code:
    #content {
      max-width: 1240px;
      margin: 0 auto;
    }
    If you remove float: left; from #content and use the code above instead, the content will center on the screen but not grow wider than 1240px; (You can choose any width, of course.)

  8. #8
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    638
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Ralph,
    What would I do about the margin-top:30px I have in there.
    #content{position:relative;float:left;width:100%;overflow:hidden;background-color:#3F3F7F;margin-top:30px;padding:10px 0}

    I think that controls the distance between the header image and the content.
    I was thinking maybe

    margin:30px auto 0

    Can you do that? Top I think has to be 30, left and right - auto, bottom - zero.


    Thanks Ralph,


    Chris

  9. #9
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Chris77 View Post
    margin:30px auto 0

    Can you do that?
    Yes, that's absolutely fine.

  10. #10
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    638
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    It's up. I'll have to go back to the store.

    Thanks Ralph

  11. #11
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Chris77 View Post
    I'll have to go back to the store.
    I have a 27" iMac, and I can assure you that it's working well.

  12. #12
    SitePoint Guru
    Join Date
    Jan 2010
    Posts
    638
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    If anyone is interested, I went back to Best Buy and it works fine now. An employee said the OS is "Lion" and not the latest "Mountain Lion". So it was a previous version of Apple's OS likely with a previous version of Safari that didn't correct for no max-width.

  13. #13
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by Chris77 View Post
    a previous version of Safari that didn't correct for no max-width.
    The versions aren't that different.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •