Support » Fixing WordPress » Removing padding for smaller screens

  • Hi all,

    I’d like to keep the page with padding for bigger screen but removing for smaller devices.

    I use the code below in the text editor, any idea what I can write there to apply it only to bigger screens?

    <div style=”margin-left: 19%; margin-right: 19%”>

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    You want to use a media query in your CSS with a specific screen size. Whether you use min-width or max-width depends on how you designed your site. (It’s best to use all one or the other as otherwise, it gets very confusing.)

    https://www.w3schools.com/css/css3_mediaqueries.asp

    Thread Starter lucio7

    (@lucio7)

    Thank you Steve.

    The issue is that I only need the padding for a single page.

    Changing the CSS would change it side-wide, right?

    I was looking for some code to insert on the editor for one-off changes.

    Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    No, CSS can be directed to just one page. Look at the <body> tag on any page.

    For example,

    <body class="home blog logged-in admin-bar no-customize-support hfeed has-header-image has-sidebar colors-custom">

    or

    <body class="post-template-default single single-post postid-528 single-format-standard logged-in admin-bar no-customize-support has-header-image has-sidebar colors-custom">

    Each page has a “postid-xxx” body class assigned (or it’s “home”, which you can use as an additional selector on your CSS

    For example

    .postid-123 div#somedividhere { margin: 0; }

    Thread Starter lucio7

    (@lucio7)

    Thank you Steve, you taught me a new thing!

    This task proved to be too much for me though 🙂

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Removing padding for smaller screens’ is closed to new replies.