New wordpress widget doesn't accept external css file - How can I add some inline style?

CMS & WordPress
1

Hello guys

Wordpress introduced a new widget called ‘‘Custom Html’’. You can add some code there and I want to add my favorite one, that will make the menu of my blog smaller because right now is quite big and I want to reduce its size. So, I thought to do this:

Css

#open-me:target {display:block;}
#open-me:not(:target) {display:none;}

Html

<a href="#open-me">Click to open the div</a>
<div id="open-me">
	<ul>
		<li>Li content here</li>
		<li>Li content here</li>
		<li>Li content here</li>
	</ul><a href="#">close me</a>
</div>

Unfortunately right now I can’t do that, since Wordpress doesn’t accept an external css file if you have a free (without hosting) blog.

So I wonder, what can I do? I thought to use inline styles but I can’t think any appropriate way. Any ideas? I want html and css ONLY, no Js, Ajax jquery or whatever. Just pure html/css. Can you help me?

Thank you

2

I think you’re out of luck for this approach with your limitations.

“not” is a pseudo-class and though I didn’t find any documentation AFAIK pseudo-classes can not be used in inline style attributes.

3

Correct, and :target is also a pseudo class, so cannot be inlined.

If you cannot use an external css, is it possible for you to add <style> tags to the head to hold your css?

1 Like
4

Why not just add it as the last entry in your theme’s css file…

5

@Mittineague
Yes I was afraid that. Though, thank you for your answer and especially for your time.

@SamA74
No I can’t; I already tried :frowning:

@Dr_John
Unfortunately I can’t do that either. I have a free blog hence all these limitations

Anyway, thank you guys. At least I/you tried. Thanks! :slight_smile:

6

Can you use the following ?

<style>
#open-me:target {display:block;}
#open-me:not(:target) {display:none;}
</style>
7

This has already been suggested.

8

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.