[Resolved] Attention box – theme feature or plugin?

[vemvem6]

Hi guys,

I’m new to WP and to this theme. I found a site that is using your Theme and I am wondering if the in-text effect is a feature of your theme or some WP plugin – I would appreciate your help.

Site is: https://stronglifts.com/barbell-row/ and there is a yellow box with text starting: “Free: download my Barbell Row checklist Read more https://stronglifts.com/barbell-row/””

Much thanks!

[Leo]

Hi there,

That can be done with some HTML and CSS.

So try this in the page content:

<div class="yellow-box">
    content here
</div>

With this CSS:

.yellow-box {
    background: none repeat scroll 0 0 #ff9;
    clear: both;
    overflow: hidden;
    border: 1px solid #e5e597;
    margin-bottom: 25px;
    padding: 20px;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

[vemvem6]

Thanks Leo! I installed Simple CSS and it worked!

I have a follow-up question though – it seems that content inside the box has a bottom margin of 25px (possibly because the content inside is a <p> paragraph).

1) Should I adjust <p> in main css file or via Simple CSS as overwriting?
2) Is there an equivalent of Simple CSS that I could use for the main stylesheet?

I have some CSS experience but I’m happy to get more

[Leo]

1) It has margin-bottom: 25px because it’s added in the CSS of .yellow-box above: https://generatepress.com/forums/topic/attention-box-theme-feature-or-plugin/#post-374453

You can just remove that line.

2) Not sure what you mean? You don’t want to add anything to the theme’s stylesheet as it will get erased during updates.

[vemvem6]

Thanks Leo!

1) I was referring to the paragraph content inside the box. I said it was 25px, but now when I was checking it was 32.3. I attached a screenshot here http://imgur.com/a/ixMNW. I would like to eliminate that 32.3px space.

2) You’re right 🙂 I didn’t realize

[Leo]

Try this

.yellow-box p {
    margin-bottom: 0;
}

[vemvem6]

You’re a savior Leo! Thanks!

[Leo]

You’re welcome 🙂

[Author]

Posts