A problem with changing style.css

Skinning and designing Serendipity (CSS, HTML, Smarty)
Post Reply
mar
Posts: 2
Joined: Sun Mar 16, 2008 8:08 pm

A problem with changing style.css

Post by mar »

Hi there.

I'm using the default theme of s9y which is carl_contest I think. I wanted to add a nicer look to my blog when posting code snippets via <pre> tags.
Something like

Code: Select all

pre {
  border: 1px dashed #000000;
  padding: 10px;
  background-color: #f1f6fb
}
to get a box around the code and a different background color to separate it more from the text.

What's funny is, when adding the above code at the top of style.css, nothing happens. No dashed borders around the <pre> contents.
But when I add something meaningless like a non-existing tag above all this, it's working and the dashed box is shown.

Code: Select all

meaningless_stuff { }
pre {
  border: 1px dashed #000000;
  padding: 10px;
  background-color: #f1f6fb
}
Does anyone have an idea what's the cause for this? I don't (but I'm a css newbie anyway...).
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: A problem with changing style.css

Post by yellowled »

mar wrote:But when I add something meaningless like a non-existing tag above all this, it's working and the dashed box is shown.

Code: Select all

meaningless_stuff { }
pre {
  border: 1px dashed #000000;
  padding: 10px;
  background-color: #f1f6fb
}
Does anyone have an idea what's the cause for this? I don't (but I'm a css newbie anyway...).
For starters, an URL to your blog would be helpful if it is online already.

Second, try checking your style.css for { which have no been closed. You might also want to run your style.css past the W3C CSS validator.

YL
mar
Posts: 2
Joined: Sun Mar 16, 2008 8:08 pm

Re: A problem with changing style.css

Post by mar »

yellowled wrote:For starters, an URL to your blog would be helpful if it is online already.
Ok, here is an entry with code snippets in pre tags.
Second, try checking your style.css for { which have no been closed. You might also want to run your style.css past the W3C CSS validator.
The validator did the trick, thanks. :D

It seems to be a bug in the default template. At the top there is a comment block that contains a nested comment, which is apparently not allowed in css.

Code: Select all

/* My comments are inside the /*  */, these can       */
/* safely be deleted if you do not require them.      */
Removing these lines solved the problem. :)
Post Reply