help with CSS wildcard for selector 3 deep

[gregorious]

I am getting a styled MLS feed from an online source and there is an h1 tag in on all property listing that is oversized. So I want to leverage the Cascading portion of CSS to target the h1 tag in my local Style Sheet. Here is the html feed:

<div id="post-1358762038" class="post">
<h1>9814 Patton Road, Asheville, NC</h1>

The DIV id "post-1358762038" is the first selector, then the CLASS "post" is the second selector and "h1" is the third selector.

The DIV id changes with each property, so some widcard/regular expressions are necessary. I can affect a change with CLASS and H1 tags but it is too generic and it effects other page elements, so I need to target the DIV tag with widcard/regular expressions and the CLASS and H1. The syntax eludes me. Here is my CSS

div[id^="post"] .post h1 {
	font-family: 'Arial Narrow', 'Helvetica Condensed', Helvetica, Arial, Verdana, sans-serif;  
	font-size: 21px;
	line-height: 21px;	
}

this page was very helpful, but ?I am trying to string multiple selectors http://circlecube.com/2008/05/using-...stylize-links/

[RyanKing1809]

Remove the space between div[id^="post"] & .post so it reads as div[id^="post"].post h1 and it'll work fine. Not exactly sure on the specifics of how the spacing in css works but without the spacing appears as though it's looking for a class attribute of an element nested within the div rather than the class attribute of the selected div.

div[id^="post"].post h1  {
	font-family: 'Arial Narrow', 'Helvetica Condensed', Helvetica, Arial, Verdana, sans-serif;  
	font-size: 21px;
	line-height: 21px;	
}

[Paul O'B]

Not exactly sure on the specifics of how the spacing in css works

The space is effectively the descendant selector

Sitepoint reference:

The combinator we use in a descendant selector is a whitespace character: a space, horizontal tab, carriage return, line feed, or form feed. Since whitespace characters are allowed around all combinators, you can include more than one whitespace character between the simple selectors in a descendant selector.

[RyanKing1809]

The space is effectively the descendant selector

Sitepoint reference:

Thanks P.

[gregorious]

Removing the space did effect the MLS listing tag, but it also affected all other H1 tags on the site. so my patch is to yeild the H1 tag to the MLS feed, and create an H0 (zero) selector and change all other H1 tags to H0.

[Paul O'B]

and create an H0 (zero) selector and change all other H1 tags to H0.

There is no H0 tag - unless you meant something else?

You should really only have one h1 tag on a site anyway as that is the main heading. You can occasionally make a case for more than one h1 but they are very rare.

If you wanted to target the first h1 that follows the div with the id you could use :first-of-type (ie9+, Firefox, Chrome).

e.g.

div[id^="post"].post h1:first-of-type  {etc....}