Welcome to CSS Creator.

If your new to CSS We hope you find the community helpful.
You can start by registering an account.
Feel free to browse around, or use the search field to find what you are after.

How best to ask for help or advice.

  • Start by searching for similar topics that have been previously discussed.
  • If your question has not been asked before create your own topic.
  • Provide thorough detail of the issue and link to an example if possible.

Lost a day

This morning I upgraded MySQL on the server, unfortunately during the process some tables belonging to this site and a couple of others on the server became corrupt. After many attempts to repair the corrupt tables I eventually gave in and resorted to restoring form yesterday's backup. The good news is the site is back up. The bad news is we lost close to a day of topics, replies and registrations. I'd like to apologize to everyone, especially anyone who posted a topic hoping for help during the missing period.

Thought of the day: box-sizing

For years many of us struggled to describe the nature of the 'Box Model' to people; of how the various elements were calculated in respect of their dimensions; we explained the issue with IE and the - then named - 'Broken box Model' we explained how this box model differed in it's approach to borders, padding and content width, how to deal with two models, hacks & filters galore, if pressed further we might have gone as far as to try and point out that the W3C gave a reasoning of why the box model had to be broken down - in respect of dimensions - into separate parts as the 'content' had to t


Box-Sizing CSS3 has including a new attribute "box sizing". This allows us to choose whether the width set to an element will include borders and padding or whether borders and padding will add to the overall width increasing its size.

The default "box-sizing model" is "content-box" this is what we have traditionally used in previous CSS Models. "Box-Sizing Border-Box" is what is used by Internet Explorer in "Quirks Mode" (Non standard compliant mode).


Adds box-shadows to an element.

/* inset, horizontal length, vertical length, blur radius, spread, color.*/
box-shadow: inset 7px 5px 3px 5px #962096; 

  • Inset, if present changes the shadow from an outer to an inner shadow.
  • Horizontal length if positive draws the shadow on the right side of the box, negative value draws to the left side of the box.
  • Vertical length if positive draws to the bottom of the box, negative at the top.
  • Blur radius, 0 value gives a sharp shadow edge, higher values give more blur.
Syndicate content