CSS on my note affects the whole screen

[Swingerzetta]

I have a note in which I use a <style> tag to change the style of td and th elements, and, in particular, makes the background of td's white. When I view this note, I notice that the top of the page, and several other elements, are now on white backgrounds.

[joo]

You could use the fact that everything in a note is inside a <pre> tag, and everything outside is not, by changing your styles in the following way:

Change:

Code: Select all

td { background: red }


To:

Code: Select all

pre td { background: red }


[Swingerzetta]

That works great! Thanks. I didn't know about that.
So, using two items not separated by commas means the style will only be applied to td's inside pre's?

[EchoMan]

Yes, that is how it works. You could also add a div and an id, e.g.

Code: Select all

<style>
#mystuff ul { background: #fff; }
</style>

...

<div id="mystuff">
<ul>
<li>first item</li>
<li>Second item</li>
</ul>
</div>


... or use specific classes, eg.

Code: Select all

<style>
.my-td { background: #fff; }
</style>

...

<td class="my-td">whatever</td>

...