Mobile formatting

AllenAllen Registered Users Posts: 10,008 Major grins
edited September 1, 2017 in SmugMug Customization

This folder page is set to stretchy with 10px R/L margin.
Both the html widget and Folder widget are set to 100% width with 0 L/R margins.
page: http://www.photosbyat.com/Birds/2017-Birding

But the html box is wonkie on mobile. Margins don't seem to work.
Background does not cover entire box either.

Another issue. I had to use this CSS to reduce huge space and position the MENU vertically under the banner. It kinda worked but didn't seem right.
/* remove space under banner except homepage */
@media only screen and (max-width: 460px) {
.sm-page-parentnode-zsB4B .sm-page-widget-12536016 {
margin-bottom: -60px !important;
height: 50px !important;
}
}

Al - Just a volunteer here having fun
My Website index | My Blog

Comments

  • TeachTeach Registered Users Posts: 320 Major grins

    Hey Allen,

    Try changing the 460 to 640 since 460 is smaller than the screen resolution of most phones.

    @media only screen and (max-width: 460px) {

    Heather
    SmugMug Support Hero
  • AllenAllen Registered Users Posts: 10,008 Major grins

    @Teach said:
    Hey Allen,

    Try changing the 460 to 640 since 460 is smaller than the screen resolution of most phones.

    @media only screen and (max-width: 460px) {

    Notice no difference.

    Al - Just a volunteer here having fun
    My Website index | My Blog
  • AllenAllen Registered Users Posts: 10,008 Major grins

    Figured out the year page above getting the border and background to behave.

    Al - Just a volunteer here having fun
    My Website index | My Blog
  • AllenAllen Registered Users Posts: 10,008 Major grins
    edited September 1, 2017

    Notice the blank widget complete with border and background above to gallery box?
    That is an empty folder widget. The problem is it shows on mobile.
    I think the default created folder page has these boxes on it whether used or not.

    I have most of my folders as "Just this folder" so I can delete it if not used.
    I don't think it should be taking space on mobile and should be fixed.

    Edit: I just opened a folder page that's still "all folders" and only has the galleries box used.
    The empty folder widget shows on mobile. I can not remove that empty widget as it would
    apply to the whole site for all folders.

    Al - Just a volunteer here having fun
    My Website index | My Blog
Sign In or Register to comment.