Skip to content Skip to sidebar Skip to footer
Home / Css / Html

Target First Element Of Div Using Css

Post a Comment
I have a WYSIWYG editor inside of a table that is placed within a div, as such...
  • My WYSIWYG

    Solution 1:

    You need .mydiv li table:first-child.

    More information.

    :first-child works in IE7+ and all modern browsers.

    An example.

    .mydiv li + table isn't working for you because that matches something like this:

    <divclass="mydiv"><li></li><table>My WYSIWYG</table></div>

    Also note that there are few things wrong with your HTML:

    <divclass="mydiv"><li><table>My WYSIWYG</table></li></table>
    • </table> at the end should be </div>.
    • The div should be a ul, because li is not a valid child of div.

    I've fixed these things in the demo above.

    Solution 2:

    Amazing what a quick google or stackoverflow search will do for you!

    .mydivlitable:first-of-type { width:100% }

    Solution 3:

    Give this a go:

    ulli:first-child table
{
    background: red;
}

    The key here is :first-child. As @Warface notes, this isn't compatible with some browsers (pretty much only IE6), but all modern browsers support > just fine. See this.

    Demo here.. Please note I've changed the markup to what is (a) correct and (b) what I think it should be.

    Solution 4:

    You are looking for the :first-child pseudo element

    But be wary of browser support.

    • You may like these posts

    Post a Comment for "Target First Element Of Div Using Css"