Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #559221

    When I watch my page on a mobile device, for instance my iPhone, the background image next to the text is taking up a lot of screen real estate. Makes sense on a computer browser but I would prefer it to just disappear when on a phone. Is there any way I can adjust the CSS to do this??

    I’ve beautifully marked the areas I want removed with red: http://imgur.com/7TGGdj2

    bg

    #559228

    Hi graugart!

    Please add following code to Quick CSS in Propulsion theme options under Styling tab

    @media only screen and (max-width: 767px) {
    .boxed #wrap_all {
        width: 100%;
    }}

    Best regards,
    Yigit

    #559240

    Thanks, it kind of worked. The background is now gone but the text still has a wide margin in each side:

    View post on imgur.com

    http://i.imgur.com/CsIBcRT.png

    #559257

    Hey!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 767px) {
    .container {
        width: 95%;
    }}

    If that does not help, please point out the changes you would like to make in your screenshot so we can make sure that we are on the same page :)

    Cheers!
    Yigit

    #559267

    Almost worked again!! :D

    Now, the top part is perfect but the actual content of the site is on the left side of the screen and doesn’t fit 95% as expected?

    Please see these screenshots: http://imgur.com/a/8TlGS

    Thank you so much for your super quick and great support!!

    #559276

    Hey!

    Please change the code to following one

    
    @media only screen and (max-width: 767px) {
    .container {
        width: 95%;
    }
    .container .one.unit, .container .two.units, .container .three.units, .container .four.units, .container .five.units, .container .six.units, .container .seven.units, .container .eight.units, .container .nine.units, .container .ten.units, .container .eleven.units, .container .twelve.units, #top .one_fifth, #top .one_fourth, #top .one_third, #top .two_fifth, #top .one_half, #top .three_fifth, #top .two_third, #top .three_fourth, #top .four_fifth {
        width: 100%;
    }}

    This should work this time :)

    Cheers!
    Yigit

    #559322

    That worked perfectly, thanks!!

    #559340

    Hey!

    You are welcome! Glad we could help. Let us know if you have any other questions or issues :)

    Best regards,
    Yigit

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘How to remove background margin on mobile/iOS view’ is closed to new replies.