Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Apply Background Color only on text

  • This topic is empty.
Viewing 10 posts - 16 through 25 (of 25 total)
  • Author
    Posts
  • #92783

    Oh, right.

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

    #92786
    angelazou
    Participant

    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]

    #92788

    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/

    #92789
    angelazou
    Participant

    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?)

    #92790

    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.

    #92792
    angelazou
    Participant

    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



    #92799

    hmm, this worked fine for me:

    h3 + .textwidget {
    clear: left;
    }
    #92800
    angelazou
    Participant

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

    #92811
    You
    Member

    HA! That is funny

    #92815

    Glad we were able to get it all sorted out!

Viewing 10 posts - 16 through 25 (of 25 total)
  • The forum ‘CSS’ is closed to new topics and replies.