Selector Question

[Megalith]

Okay, I feel like a noob asking this, but you have to point selectors toward the direct parents of anything you want to style, correct?

I was trying to add a margin to <p class="dsq-widget-meta">. Initially, I tried p.dsq-widget-meta, but that did nothing. However, ul.dsq-widget-list p worked.

Is there a way to actually target <p class="dsq-widget-meta"> directly?

<div id="container">
<div id="content">
<ul id="sidebar">
<li id="calendar-2" class="widget widget_calendar">
<li id="text-2" class="widget widget_text">
<div class="textwidget">
<div id="popularthreads" class="dsq-widget">
<h2 class="dsq-widget-title">Popular Threads</h2>
<script src="http://what.com/popular_threads_widget.js?num_items=5" type="text/javascript">
<style media="screen" type="text/css">
<ul class="dsq-widget-list">
<li class="dsq-widget-item">
<a class="dsq-widget-thread" href="http://what/2012/02/19/">What</a>
<p class="dsq-widget-meta">5 comments · 1 day ago</p>

[penders]

You don't need to (always) "point selectors toward the direct parents"... in doing so you are simply increasing the selectors specificity. (See #3 here... Cascading Order [w3.org]) p.dsq-widget-meta could have worked OK, but another style was probably overriding it.

The browser tools in Chrome and Firefox should tell you from where your styles are coming from.

[rocknbil]

Are you using the FireFox extension FireBug? You can right click the element and see what is affecting it, your class selector was probably "working" and something else was overriding it.

If it's "just this instance" - a SINGLE instance on any given page - you can add an ID to it and access it that way, too.

Though a p is valid inside an li, block elements inside lists never made a lot of sense to me. :-)

[lucy24]

Though a p is valid inside an li, block elements inside lists never made a lot of sense to me.

Depends on what the <p> is doing. I have a lot of this pattern:
<li>blahblahblah
<p>subsidiary blahblahblah</p></li>
where the subsidiary stuff is differently formatted-- smaller type, bigger side margins, that kind of thing. It's less bother than shoving in a <ul> just for one paragraph and having to work out the styles and hanging indents all over again. CSS only has to say
li p {font-size: something; margin: something;}

[rocknbil]

Nah it's a personal thing and nothing to do with specifications. A list should be a list. It shouldn't contain a *separate* a self-contained unit dealing with a particular point or idea (paragraph,) it shouldn't start new topics with headings, it should be it's own point in a series of related points - a list. Nesting other elements like this is perfectly valid, it's used all the time, but I won't do it. :-)