WordPress.com Forums » Topic: @-rules http://en.forums.wordpress.com/topic/-rules WordPress.com Forums » Topic: @-rules en Sun, 26 May 2013 07:39:11 +0000 http://bbpress.org/?v=1.1-alpha-2539 squarepixel on "@-rules" http://en.forums.wordpress.com/topic/-rules#post-1131950 Wed, 23 Jan 2013 17:16:59 +0000 squarepixel 1131950@http://en.forums.wordpress.com/ Applying some custom design for a specific post should be pretty easy.

If you look at the source code of your page, and search for the <body> tag, you will see that it has some useful CSS classes, such as:

<body class="single single-post postid-3 single-format-standard ...

The useful part for you is the "postid-321", which is the unique ID of this post.

You can now style your specific content like this:

.postid-321 .element-I-want-to-change { background: yellow; color: black; }

If you want to make page-specific changes, this method should work fine.

]]> ofrag on "@-rules" http://en.forums.wordpress.com/topic/-rules#post-1130985 Tue, 22 Jan 2013 21:18:01 +0000 ofrag 1130985@http://en.forums.wordpress.com/ The end goal was to make page specific modifications. So what you are proposing will work.

<br /> .pagetype > .element-I-want-to-change<br />

Now I'm just wondering what I would do if I had to change a specific post that shares a layout with other pages...

Currently AFIK the only browser that supports it is firefox.

]]> designsimply on "@-rules" http://en.forums.wordpress.com/topic/-rules#post-1130674 Tue, 22 Jan 2013 17:37:13 +0000 designsimply 1130674@http://en.forums.wordpress.com/ I read that @document has been deferred to CSS4:
http://dev.w3.org/csswg/css3-conditional/#changes

I also couldn't find much info on browser support, so I'm not sure how many browsers currently even support it.

What is your end goal? Are you trying to target specific types of pages? If so, WordPress.com applies body classes to all of the different page types and those can be used to target various page types.

]]> ofrag on "@-rules" http://en.forums.wordpress.com/topic/-rules#post-1123785 Mon, 14 Jan 2013 18:45:50 +0000 ofrag 1123785@http://en.forums.wordpress.com/ Trying to use @document{} rule set and on update the system strips out the nested rule.

Example:

@document url("http://www.w3.org/Style/CSS/") {
  #summary { background: yellow; color: black}
}

on save result:

@document url("http://www.w3.org/Style/CSS/") {
}
}

Any pointers?

]]>