htmlpie

The first screenshot: I meant to remove the CSS from that file (click the filename of that CSS code which looks like a link, on the right side) to see which part may make the problem go away.

The second screenshot: It belongs to that widget above the Discord widget, you should either replace the $ in its JavaScript code with jQuery or wrap the code like this:

(function($){
	$(document).ready(function() {
		/* That code goes here. */
	});			
}(jQuery));

Hi there,

Right, it is however working fine over here and for some of your visitors too, so it’s more likely to be a bug in your Web browser and/or extensions.
You should either put that CSS file somewhere so you can edit it, or edit it live through DevTools, to see which part might be causing that, start with those prefixed properties, or the :root, it’s for those Dark Mode settings.

PS: You can submit a support ticket here.
https://support.discord.com/hc/en-us/requests/new

Hi there,

So you have checked with several themes and they all have had dark backgrounds behind the widget, and they all have displayed the corners without white pixels, all on the same Web browser, and only this theme does not show it correctly? That’d be weird!

This one in the screenshot, I’d say that’s because the widget is smaller and so happens to be easier to calculate semi-transparent pixels for anti-aliasing.

Anyway, since this is a whole separate page shown in an <iframe> it is not this theme that is creating that problem, it is your Web browser, and it is not this theme that can prevent the problem, it is those who are making that widget, that is Discord. You should write to them and send them the above information.

Here’s some more details, if you want to help them narrow it down quickly.

Check the answer here, please:
https://stackoverflow.com/questions/16938437/white-corner-showing-on-black-box-with-border-radius

Then, right click on the widget and select Inspect element, in the DevTools you can see the widget is inside an <iframe> and therefore displaying another webpage, from Discord itself, so this is nothing I can fix.

Right there, check the <div class="widgetHeader-2Hz_Ln"> element. It has that light purple background, but no border-radius, its container does though (the <div class="widget-szj0pM widget-theme-dark">) and it happens to have an overflow:hidden too! That’s important and that’s the root cause of this problem with some certain Web browser engines.

You should email Discord, send them the screenshots and the above version numbers, I’m sure they can fix it quickly.

Thanks! ??

Right, I can say with great certainty that it has nothing to do with this theme. You can check with other themes as well, to make sure. I’d contact those who are providing that widget and send them screenshots plus the exact Web browser and OS name and versions.

Hi there,

Does it also happen when you are not logged in to the backend?

For the links, try this CSS:

#content a {
  text-decoration: none !important;
}

Not sure about the footer size, do you mean the width or the height? Either way, the HTML ID is #pen_footer, so you can manipulate it with CSS.

The CSS should be added through Appearance → Customize → Additional CSS.

Are you sure you have changed the “Site” background color? and also checked the “Dim the lights” too.

Hi there,

Sure, it is Appearance → Customize → Background Images → Site → Dim the lights, and if you want to change the colors, it is Appearance → Customize → Color → General → Site background color.

Hi there,

It is looking fine right now, seems like you’ve figured it out?

Thanks! ??

Hi there,

It appears you have figured it out. For the record, you can either hide content author, date, category, etc. or move them to the footer, through Appearance → Content → Full Content View, or if it’s for an individual content, you can do the same through Edit → Pen Options.

Thanks! ??

Thanks! ??