Rounded Corners get overridden by color for “Title/Tagline Area BG”

[MNL43RD]

I am having problems rounding off the upper page corners on the site http://www.RPAmichigan.org  I am using Weaver Xtreme free version 4.3.5, within the WordPress “customizer”. I got it to look like I wanted, so maybe this is a bug report? (Didn’t see the topic elsewhere in the forum, nor any place to report bugs.) Here is the problem and the solution: By assigning a color value to the header container instead of using “inherit” it makes the area take a square shape and overwrite the other setting for rounded corners. Here is what you need to do to prevent this:

– From “Layout”… “Core site styling” you set the background color of the header.

– then on the menu “Colors” … “Header area”, use the value of “inherit” for both the Title/Tagline Area BG Color and also the Site Title BG color.

 

[scrambler]

When you the header background color, did you also set the rounded corners for the header area?

because4 if you round the corners on  the wrapper area, but add a background color to the header without rounded corner on the header, then it is normal that they become square, given the header area is over the wrapper at the top…

[MNL43RD]

I found the checkbox for rounding the corners on the header, but it didn’t take effect. Did not solve the problem. Which is why I think it might be a bug.

[scrambler]

I would need to see the Site when the problem is apparent to be sure of what is going on.

 

[MNL43RD]

Here is the above site, http://www.rpamichigan.org, with the top corners done right, that is, only using “inherit” on the page, Colors…Header …. Title/Tagline Area BG Color.

Here is another site I have control of, http://www.marianpeace.org, with the top corners done wrong, that is, trying to specify #5A81C7 for  Title/Tagline Area BG Color.  It is not a fix to go to Style…Wrapping Areas or Style…Header with their options for borders and rounding corners. They don’t round what is controlled by Title/Tagline Area BG Color.

[scrambler]

I did not read you first post carefully.

What you are getting is  a limitation of the current implementation of rounded corners.

If you set a background color for the Title and tagline, that area does not have rounded corners and is over the one that does.

The workaround is either to apply the background color to an area that does have the rounded corners option (like the header, or add the rule below to the theme Global Custom CSS Rule box to also round the corners of the Title tagline area

#title-tagline {border-radius: 8px;}

 

[MNL43RD]

Thanks, that code works!

[Author]

Posts