Apply Background Color only on text

[joshuanhibbert]

Oh, right.

You need to give the first item below the header (the one that is currently to the right) clear: left;

[angelazou]

But that means I have to search the entire theme for every instance coming after the header. Is there a shortcut? Perhaps a clear:right; for the headers? [Nope, clear: right; didn’t work]

[joshuanhibbert]

I assume that it is mainly paragraphs coming after headers? If this is the case you could use this:

h1 + p {

clear: left;

}

Shown here: http://jsfiddle.net/sl1dr/Fxja2/

[angelazou]

Thanks for the tip, but unfortunately again, it only solves part of the problem. I am seeing some improvement, but not all of them. I’m using the following:

h1 + p, h2 + p, h1 + a, h2 + a, h1 + div, h2 + div {

clear: left;

}

But the code that I previously gave (for the Date too close thread) doesn’t really apply even though it’s immediately followed by a div. Is there a wildcard I can use? (And hopefully, it works with IE9, right?)

[joshuanhibbert]

The wildcard selector (*) would cause you to have problems with other floats in your design, such as the date bit. The other option, as @Senff said, is to wrap every header in a div.

[angelazou]

I did a little more digging and fixing, and I’m left with a final section, the text widgets. I use a lot of them, but I couldn’t get them to bend.

Initially, I used the following

h2 + #text-1, h2 + #text-2, h2 + #text-3, h2 + #text-4, h2 + #text-5, h2 + #text-6, h2 + #text-7, h2 + #text-8, h2 + #text-9, h2 + #text-10, h2 + #text-11, h2 + #text-12, h3 + #text-1, h3 + #text-2, h3 + #text-3, h3 + #text-4, h3 + #text-5, h3 + #text-6, h3 + #text-7, h3 + #text-8, h3 + #text-9, h3 + #text-10, h3 + #text-11, h3 + #text-12  {

clear: left;

}

Didn’t work, then I tried this

h2 + textwidget, h1 + textwidget, h3 + textwidget {

clear: left;

}

Didn’t work either. Here is a sample text widget content

Title
			
Google

[joshuanhibbert]

hmm, this worked fine for me:

h3 + .textwidget {

clear: left;

}

[angelazou]

Haha, I forgot the ., so basically the page was looking for an element called textwidget. How sloppy of me!

[You]

HA! That is funny

[joshuanhibbert]

Glad we were able to get it all sorted out!

[Author]

Posts