Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #92647
    fmck718
    Participant

    Hi,
    Love the site! I’ve just noticed an issue that I will need your help with. My website (ourladyofsorrowsschool.org) has a grey border when viewed on desktop computers, but no border when viewed on mobile phones. This is how I want the site to appear on mobile phones.

    However, I noticed that the grey border is now appearing on mobile phones as well. Can you help me hide this border from the mobile phone experience?

    Thank you.
    FM

    #92674
    Mahesh
    Participant

    @fmck: Go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

    .sb-options a {
        border-bottom: none;
    }

    Let me know if any problem.

    Regards,
    Mahesh

    #92880
    fmck718
    Participant

    Hi Mahesh,
    Thanks for the quick response. I added the Custom CSS as instructed. However, nothing has changed.

    I would like the gray border removed from smaller viewing platforms (like mobile phones) only. I’m hoping to keep the gray border on bigger viewing platforms (like desktop computers). Can you let me know if there is another way to fix this?

    Thanks.
    FM

    #92945
    Mahesh
    Participant

    @fmck718: I checked your site and seems that the border is no gone. Please check the image in the link below.
    http://goo.gl/n82nwd
    Let me know if any problem.

    Regards,
    Mahesh

    #93041
    fmck718
    Participant

    Hi Mahesh,
    Apologies if I’m using the wrong terminology. I took a screenshot of what I’m talking about – https://dl.dropboxusercontent.com/u/27224338/GreyBorderonMobileSite.jpg

    I’ve inserted black arrows in the screenshot to show you what I would like to remove from the mobile experience (the grey border/background). Once the background is removed, the content should extend to the edges of the screen. Right now, the gray background is forcing all content into a very tight space in the middle.

    Hope this makes it clearer for you.

    Thanks.
    FM

    #93070
    Mahesh
    Participant

    @fmck: Go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

    @media screen and (max-width: 480px) {
        .site, 
        .no-sidebar-one-column .site {
            margin: 0 auto;
        	width: 100%;
        }
    }

    Regards,
    Mahesh

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Mobile site now has border’ is closed to new replies.