Firefox Ignores Padding Input

Although a cascading style sheet or "CSS" document is designed to let you modify the style of a Web page across all browsers, certain elements don't automatically display correctly in all browsers. To ensure that space or "padding" around an element shows in Mozilla Firefox, you may need to add a special notation within the CSS document.

  1. How CSS Works

    • Cascading style sheets work as a series of elements whose stylistic parameters are specified in the document, which you then apply to the HTML document using the element name. For example, consider the following element:

      .content {background:#FFF; border-color: blue; border:2px;}

      This element has a black background and has a two pixel blue border around it. You apply it to HTML as follows:

      <div id="content">Some content.</div>

    Padding

    • One of the many stylistic specifications you can make within a CSS document is adding space or "padding" around a particular element. To add padding to the "content" element above, for example, you would write the following:

      .content {background:#FFF; border-color: blue; border:2px; padding:5px;}

      Adding this component to the CSS document is the only change you need make to apply it to the element, provided you have already applied the modification to the HTML code.

    -Moz-Padding Element

    • Certain CSS elements do not display in the Mozilla Firefox browser unless you make dedicated CSS declarations for them. Specifically, you can add the prefix "-moz" to any element to make sure it is visible in Firefox. With the example we have been using, you would write the following:

      .content {background:#FFF; border-color: blue; border:2px; padding:5px; -moz-padding:5px;}

      Note that you add the "-moz-padding" element in addition to the generic "padding" element, as the former applies only to Firefox and not all Web browsers.

    Updating Firefox

    • If you find that the padding doesn't show in Firefox even after you have added Firefox-specific HTML, you should make sure you have the latest version of Firefox installed onto your computer. Although Firefox should update automatically, it is possible that it won't. To update Firefox manually, select the "About Firefox" option from the "Firefox" menu, and then wait for the update to begin installing.

Related Searches:

References

Comments

Related Ads

Featured