3

I am trying to include the "flair" in my website. One problem I face is that I cannot change the background color. I went to the flair page and saw that I should use the css style to change. I am very poor in CSS. I have my domain in blogger. So it would be really helpful if someone could tell me how to do it.

This is what I've done which is not working

<script style="background-color:grey" 
  src="http://stackoverflow.com/users/flair/252398.js?theme=clean" 
  type="text/javascript"></script>
3
3

One thing wrong with this. :)

Styles go inside style tags, like so:

<style>
    .valuable-flair { background-color: gray !important; }
</style>

Make sure that goes in between the <head> tags. !important makes sure that style overrides the one specified in the Javascript. You should put that under this revised line:

<script src="http://stackoverflow.com/users/flair/252398.js?theme=clean" type="text/javascript"></script>

And you should be fine.

You can only apply styles like that to tags inside the <body> tag, although that's bad practice. One better would be to put it between <style> tags, the other would be to put it all in a separate stylesheet and link to it using a <link rel="stylesheet"> tag.

2
  • technicalypto.com If you see the page, the box is kind of cut in the bottom. Any idea why ? – bragboy Apr 9 '10 at 20:02
  • The CSS is restricting .valuable-flair's height to 50px. To that .valuable-flair rule, make sure to add height: auto !important; again, to make sure it overrides the Javascript's version. (Just a note that !important should be used sparingly, we're just using it a lot here because we're importing a CSS file via JS.) – Bryan Veloso Apr 9 '10 at 20:12
3

Add this to your page. Css is not an attribute for the script tag.

<style>
.valuable-flair
{
        background-color: grey;
}
</style>
2

https://meta.stackoverflow.com/users/flair/YOURUSERID.js will produce the flair, which you can customize with CSS.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .