Web Designer Nepal, Freelance web designer, web developer, joomla, wordpress, web designer australia, web designer sydney, Web developer Sydney

CSS2 doesn't have a property to add a shadow to a box. You can try to add a border to the right and bottom, but it won't look right. However, if you have two nested elements, you can use the outer one as a shadow for the inner one. For example, if you have a text like this (HTML):

<div class=back>
  <div class=section>
    <h2>Die Rose duftet - doch ob sie empfindet</h2>
    <address>Heinrich Heine (1797-1856)</address>

    <p>Die Rose duftet - doch ob sie empfindet<br>
    ...
  </div>
</div>

you can use the outer DIV as a shadow for the inner one. The result might look like this separate page. First, give the BODY a background (light green in this example), the outer DIV a somewhat darker background (green-gray) and the inner DIV another background (e.g., yellow-white):

body {background: #9db}
div.back {background: #576}
div.section {background: #ffd}

Next, by using margins and padding, you offset the inner DIV a little to the left and up from the outer DIV:

div.back {padding: 1.5em}
div.section {margin: -3em 0 0 -3em}

You also have to move the outer DIV a little to the right. And if you have multiple sections, you probably want some space between them, too:

div.back {margin: 3em 0 3em 5em}

That's basically it. You can add a border around the inner DIV if you want. You'll probably also want some padding inside it, e.g.:

div.section {border: thin solid #999; padding: 1.5em}

Of course, you can vary the size of the shadow to your taste.

Here's how you would use the label tag and some CSS to create a stylin' form with very little markup:

<style>
label { position: absolute; text-align:right; width:130px; }
input, textarea { margin-left: 140px; }
label.check, label.radio { position:relative; text-align:left; }
</style>
<form>
<label for="name">Your Name:</label>
<input type="text" name="name" id="name" /><br />
<label for="email">Your Email:</label>
<input type="text" name="email" id="email" /><br />
<input type="checkbox" name="subscribe" id="subscribe" />
<label for="subscribe" class="check">Subscribe</label>
</form>

If you don't want to apply this styling to ALL forms on your website what I usually do is give my form an id, and then use the ID in the style sheet such as:

#myFormID input, #myFormID textarea { ... }