0

I have a div with a padding, created and styled by Javascript. This div is created on a page with the following CSS rule:

div {
    width: 100%;
}

This messes up, as it changes the width of my created div to what it naturally would be PLUS its padding (so I end up with buttons outside of the div borders). I can't statically set div widths because they depend on the content. So how can I overwrite this rule and bring it back to "default width"?

Mala
  • 14,178
  • 25
  • 88
  • 119

1 Answers1

1

You need the following CSS:

div { width: auto; }

Since the CSS rule is applied through JavaScript, which causes it to be an inline style, you may have to use !important to make sure the new rule has a higher specificity so you can overwrite the old one.

div { width: auto !important; }

Of course, it would be even better if you could just edit the JavaScript so it wouldn’t add the style to the div anymore.

Mathias Bynens
  • 144,855
  • 52
  • 216
  • 248
  • THANK YOU! Questions like this have been bugging me for ages, I never knew such a simple and handy rule existed – Mala Aug 10 '10 at 08:40