• Resolved cag8f

    (@cag8f)


    I have a page (theseasonssamui.com) in which the main content has a fair amount of padding and margin. I’d like to eliminate them. An inspect element illuminates the element in-question, and the entry is:

    media="all"
    @media screen and (min-width: 1218px)
    .archive-header, .comments-area, .image-navigation, .page-header, .page-content, .post-navigation, .site-content .entry-header, .site-content .entry-content, .site-content .entry-summary, .site-content footer.entry-meta {
    margin-right: 54px;
    }

    I’m not sure what the entry in my style.css should be to set this margin to 0px. I’ve tried all of the intuitive possibilities, but the margin/padding remains unchanged.

Viewing 11 replies - 1 through 11 (of 11 total)
  • Try to set check it real time ( browser inspection ) in firefox by editing css elements

    Thread Starter cag8f

    (@cag8f)

    Thanks. That’s a bit over my head though. I know what Firefox is. Apart from that, the rest was Greek. How exactly do I set check in real time? And what does it indicate?

    You can watch a tutorial here
    https://www.youtube.com/watch?v=Q5h-6kZX5HE

    Thread Starter cag8f

    (@cag8f)

    OK thanks. I gave used Firebug and determined that editing the entry:

    .archive-header, .comments-area, .image-navigation, .page-header, .page-content, .post-navigation, .site-content .entry-header, .site-content .entry-content, .site-content .entry-summary, .site-content footer.entry-meta {
        margin-right: 54px;
    }

    does indeed modify the margin in-question (I confirmed it in real time). However when I enter that same code into my style sheet, the margin does not change.

    The DIV element in-question is nested inside a handful of other div elements. When I edit the margin (or padding) property in my CSS file, do I need to somehow specify all of these parent divs?

    Clear your browser cache or check in other browser . It must change if you did that .

    Thread Starter cag8f

    (@cag8f)

    I copied and pasted the above code into my style.css, then changed “margin-right” to 1px. That resulted in no change. Clearing my browser cache does not result in any change either, nor did checking in another browser (Incognito Chrome, Firefox). Any thoughts on how to troubleshoot further?

    does indeed modify the margin in-question (I confirmed it in real time). However when I enter that same code into my style sheet, the margin does not change.

    Hopefully you have made a child theme and you are using the style.css in your child theme. Your custom css must come after the import of the parent style.css.

    Thread Starter cag8f

    (@cag8f)

    Thanks. I am indeed using a child theme, and editing the style.css of the child.

    Have you tried a CSS Validator. Its showing up several errors and I think they need to be worked through and fixed, otherwise its difficult to see what’s happening.

    Thread Starter cag8f

    (@cag8f)

    OK thanks for that, I’ll give it a look.

    I should also note that I resolved my original issue. It was either user error, or an uncleared browser cache.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Remove margin/padding from element’ is closed to new replies.