How do I make full width on mobile devices?

Discussion in 'ColorWay WordPress Theme' started by brunospace_168h, Sep 13, 2015.

  1. brunospace_168h

    brunospace_168h New Member

    Joined:
    Aug 27, 2015
    Messages:
    13
    Likes Received:
    0
    My client wants their website display full width on mobile devices. Since the screen is already so small, they ask me to take away the margin around the full page. How do I make it full width on mobile devices?

    Thank you for your help!
     
  2. nitin

    nitin Guest

    Hi,

    Greetings from InkThemes,

    It would be our pleasure to serve you.

    Could you please provide us URL of your website along with some edited screenshot so that we can assist you accordingly?

    Thanks & Regards!
    Nitin
    InkThemes.com
     
  3. brunospace_168h

    brunospace_168h New Member

    Joined:
    Aug 27, 2015
    Messages:
    13
    Likes Received:
    0
    Hi Nitin,

    Here is a link to a page:http://www.jandmdigitaldesign.com/and a screenshot of the page in smaller desktop windows. There are issues on mobile view as well.
    The Margin around the full page looks really big. How can I set margin:0px? or even just half margin than now would be good.

    Thanks for your help!
     

    Attached Files:

  4. priya

    priya Guest

    Hello,

    Greetings from InkThemes!

    Please paste the code given below in Custom CSS section (Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.
    Code:
    @media only screen and (max-width: 960px) and (min-width: 768px){
    .container_24 {
        width: 913px !important;
        margin-top: 10px !important;
        margin-bottom: -18px !important;
    }
    }
     
    @media only screen and (max-width: 767px) and (min-width: 480px){
    .container_24 {
        width: 424px !important;
        margin-top: 10px !important;
        margin-bottom: -12px !important;
    }
    }
     
    @media only screen and (max-width: 480px){
    .container_24 {
        width: 335px !important;
        margin-top: 10px !important;
        margin-bottom: -10px !important;
    }
    }
    Note: Change the numeric value as per your requirement.

    Hope it will resolve your issue :)

    Do let me know if you need more assistance,
    Thanks & Regards!
    Priyanka
    InkThemes.com
     
  5. brunospace_168h

    brunospace_168h New Member

    Joined:
    Aug 27, 2015
    Messages:
    13
    Likes Received:
    0
    Thanks Priyanka. But the menu (hamburger icon) disappear after I paste above CSS Code in.
    No menu icon on mobile devices then.:(
     
  6. priya

    priya Guest

    Hello,

    Greetings from InkThemes!

    I have checked your site and the menu icon is still over there on mobile devices.

    Here's the video, please have a look

    Link of the video: http://screenpresso.com/=X6kzd

    Do let me know if you need more assistance,
    Thanks & Regards!
    Priyanka
    InkThemes.com
     
  7. brunospace_168h

    brunospace_168h New Member

    Joined:
    Aug 27, 2015
    Messages:
    13
    Likes Received:
    0
    Hi Priyanka,

    I could not let the issue stay there all the time. So I deleted those code after I found out that problem. I can paste those CSS Code again if you need. Could you please let me know a specific time you are going to check. I'll paste code back again.


    Thank you very much.


    Jennifer
     
  8. priya

    priya Guest

    Hello Jennifer,

    Could you please share your dashboard credentials at [email protected] so that we can figure out the issue and able to give you an appropriate solution.

    Looking forward to your reply.

    Thanks & Regards!
    Priyanka
    InkThemes.com
     
  9. brunospace_168h

    brunospace_168h New Member

    Joined:
    Aug 27, 2015
    Messages:
    13
    Likes Received:
    0
    OK! Thank you very much.
     

Share This Page