• Resolved mwrmwr

    (@mwrmwr)


    WP 5.4, Astra theme. I see a faint horizontal line under the page header, and similar faint lines around table elements on the page contents below. How do I get rid of those?

    https://mruthvenart.com

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

Viewing 15 replies - 1 through 15 (of 16 total)
  • Wow, spent 5-10 minutes looking at this and it’s got me perplexed.
    This is a css issue, not WordPress so I recommend posting into a forum with more CSS focused
    e.g. css tricks or stack overflow

    Thread Starter mwrmwr

    (@mwrmwr)

    I added no CSS to the site at all, so I assume the issue is caused by WordPress or the Astra theme. I did manually add a table to that page.

    Hi,

    Add the following CSS to the Customizer, child theme or custom plugin to remove the border from the header:

    .site-header {
    	border-bottom: 0;
    }

    Then, for the table, it depends on if you want to remove the borders from all the tables or just from that one. In any case, I recommend you to add a custom class or ID to it and then use CSS to remove them.

    Thread Starter mwrmwr

    (@mwrmwr)

    I added that CSS code to the Customizer, under Additional CSS, but it didn’t change anything.

    Yeah, it’s because of the CSS selector specificity.

    Try using:

    #page .site-header {
        border-bottom: 0;
    }
    Thread Starter mwrmwr

    (@mwrmwr)

    Thanks, but that didn’t work either.

    All the borders on the elements showing, show border: 0 in css

    It shouldn’t be showing… Don’t understand how it is…

    I just checked. It’s still showing because it’s not the only container adding that border-bottom. Use:

    #page .site-header, #page .main-header-bar {
        border-bottom: 0;
    }

    For the table, as I mentioned before, add a custom ID (ex. “custom-id”), and then use:

    #custom-id table, #custom-id table td {
        border: 0;
    }
    Thread Starter mwrmwr

    (@mwrmwr)

    I just did the first part and that worked! Now on to the table part…

    Thread Starter mwrmwr

    (@mwrmwr)

    I’m really a CSS idiot. Could you provide an example of adding a custom ID, and where to put it and the following code you provided”

    I can’t know how you added that table to that page without access, but you probably used the WP editor.

    If so, edit the page and replace:

    <table> with <table id="homepage-table">

    and then add the following CSS to the Customizer

    table#homepage-table, table#homepage-table td {
        border: 0;
    }
    Thread Starter mwrmwr

    (@mwrmwr)

    I did that, but it didn’t work.

    I updated the CSS in my last reply.

    Thread Starter mwrmwr

    (@mwrmwr)

    Wow, that worked! Thanks so much. I would never have been able to figure that out myself.

    Next question. Why was all that necessary?

    Glad it worked.

    It’s normal to need CSS to change this level of detail. Most themes, like Astra, would be too heavy if they had options to modify small things like the header border dynamically.

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘can’t get rid of faint border lines’ is closed to new replies.