Abnormal look on lower resolution display

JakalJakal Beginner grinnerPosts: 5Registered Users 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 "tweak 'til it squeaks" St. Louis, MoPosts: 9,651Registered Users 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 | My Blog
  • leftquarkleftquark SmugMug Product Team Posts: 3,607Administrators, Vanilla Admin, SmugMug Product Team SmugMug Employee
    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?
    SmugMug Director of Product / dGrin Afficionado
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • JakalJakal Beginner grinner Posts: 5Registered Users 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 Beginner grinner Posts: 5Registered Users 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 Beginner grinner Posts: 5Registered Users 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 SmugMug Product Team Posts: 3,607Administrators, Vanilla Admin, SmugMug Product Team SmugMug Employee
    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.
    SmugMug Director of Product / dGrin Afficionado
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • JakalJakal Beginner grinner Posts: 5Registered Users 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 SmugMug Product Team Posts: 3,607Administrators, Vanilla Admin, SmugMug Product Team SmugMug Employee
    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 :(
    SmugMug Director of Product / dGrin Afficionado
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • annnna8888annnna8888 Slovenian Support Her0 SloveniaPosts: 933Registered Users, Super Moderators 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
Sign In or Register to comment.