Topic Resolution: Resolved
  • Closed
  • Rssn
    Spectator
    June 21, 2015 at 7:32 am #18382

    When my website is viewed via mobile, the content responsiveness was not showing full, since I’m using this custom css
    #primary {
    width: 73%;
    }

    I’ve use the above css to resize my side bar using this custom css
    #secondary {
    max-width: 300px !important;
    }

    Is there any other workaround? I tried to remove the custom css for #primary but the problem is the right side of my sidebar gets a larger space.

    http://www.trendscend.net

    Denzel Chia
    Moderator
    Posts: 2656
    June 21, 2015 at 9:39 am #18387

    Hi,

    Don’t remove any of your previous custom css codes.

    You can use media queries http://stephen.io/mediaqueries/
    For example in iPhone 6 portrait view. The following code will make your content fill up the width, instead of 75%.

    @media only screen
    and (min-device-width : 375px)
    and (max-device-width : 667px)
    and (orientation : portrait) {
    /* STYLES GO HERE */
    #primary {
    width: 100%;
    }
    }

    There are many possibilities, Please kindly try them out yourself.

    Thanks!
    Denzel

    Rssn
    Spectator
    Posts: 31
    June 21, 2015 at 9:43 am #18388

    Thank you so much Denzel!