Abnormal look on lower resolution display

JakalJakal Registered Users Posts: 5 Beginner grinner
edited January 14, 2016 in Bug Reporting
Hello,

Do you have any idea why my site (http://www.gabriel-jakab.com/) looks different on smaller displays? On my 27" it looks the same in every browser, but when i tried it on 15.6" and 12.5" laptops the left side menu bar appears disproportionated (as you can see in the attachement), although the main body, with the photos, looks ok. Thanks!

Comments

  • AllenAllen Registered Users Posts: 10,007 Major grins
    edited January 12, 2016
    Check and make sure the browser is set to 100% zoom.
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited January 13, 2016
    Hi Jakal, I took a look in CHrome and it looks like everything is fine, even at smaller resolutions. In the screenshot you posted I don't quite see the disproportioned left -- perhaps I'm missing something?
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • JakalJakal Registered Users Posts: 5 Beginner grinner
    edited January 13, 2016
    leftquark wrote: »
    Hi Jakal, I took a look in CHrome and it looks like everything is fine, even at smaller resolutions. In the screenshot you posted I don't quite see the disproportioned left -- perhaps I'm missing something?


    Hello,

    Thanks for the reply. I forgot to mention that on my 27" display, the social media buttons are visible in the homepage, without needing to scroll down. So that's my problem: on different displays, the site looks different
  • JakalJakal Registered Users Posts: 5 Beginner grinner
    edited January 13, 2016
    Allen wrote: »
    Check and make sure the browser is set to 100% zoom.


    That was the first thing I checked, but it's something else :) Thanks anyway
  • JakalJakal Registered Users Posts: 5 Beginner grinner
    edited January 13, 2016
    This is how it looks on my 27"" display. As you can see, the social media icons are visible and you don't need to scroll down to see them
  • leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited January 14, 2016
    It looks like your 15.6" and 12" laptop screens are at a smaller resolution, which would explain why the menu bars appear larger and need to scroll. Everything on your site appears to be functioning as expected.
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • JakalJakal Registered Users Posts: 5 Beginner grinner
    edited January 14, 2016
    leftquark wrote: »
    It looks like your 15.6" and 12" laptop screens are at a smaller resolution, which would explain why the menu bars appear larger and need to scroll. Everything on your site appears to be functioning as expected.


    I suspected that, but do you know if there is any solution to fix this? Some kind of CSS or Html code to optimize it for different resolutions? Thanks
  • leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited January 14, 2016
    Typically, we can write some CSS that will change things when the width of the screen isn't as large (for example, a mobile screen vs a desktop screen), but resolution is a bit different, since that very low resolution small laptops have to blow up the size due to the smaller pixels. I don't know of any code that works on resolution - they all use width. Your page loads find at any width, it's just that those monitors with low density pixels display them larger/poorer. Perhaps someone else can chime in :(
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • annnna8888annnna8888 Registered Users, Super Moderators Posts: 936 SmugMug Employee
    edited January 14, 2016
    You could make the top margin in the logo content block and the social icons content block smaller; right now they are 110 and 180 pixels respectively, pushing the content blocks down.

    Ana
    SmugMug Support Hero
    Ana
    SmugMug Support Hero Manager
    My website: anapogacar.smugmug.com
Sign In or Register to comment.