Site width setup in mobile & Desktop

  • Resolved rajesh25

    (@rajesh25)


    7 years, 11 months ago

    Hello,
    Thanks for this beautiful theme.
    I have changed my site width using custom css
    .site {
    max-width: 70% !important;
    }
    It is looking good in desktop, but in mobile device the content is floating left side.

    How to set up my site widh 70 % in desk top and 100 % in mobile device.

Viewing 4 replies - 1 through 4 (of 4 total)

  • Can you suply a URL adress

    You need a media query here in order to make the site to use up the entire browser window of your mobile.

    For example for smartphones you can opt for this:

    
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
   .site {max-width: 100%;}
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width: 321px) {
  .site {max-width: 100%;}
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width: 320px) {
  .site {max-width: 100%;}
}

    Let me if this helps.

    Hello @rajesh25, I would love to know how you resolved it.
    Did my suggestion help you anyway?

    Thank you!

    Thread Starter rajesh25

    (@rajesh25)

    Hi Subrata Sarkar,

    Thanks for your response.
    I used the following custom css to solve my problem,
    .site {
    max-width: 950px;
    }
    Now my site is looking good in both desktop and mobile device.

    Again I would like to thank you for your response.

    • This reply was modified 7 years, 11 months ago by rajesh25.
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Site width setup in mobile & Desktop’ is closed to new replies.