HTML and CSS

Shadow

Please support our HTML and CSS advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Oct 2009

Posts: 12

Reputation: prachipote is an unknown quantity at this point

Solved Threads: 0

prachipote prachipote is offline

Offline

Newbie Poster

Shadow

17 Days Ago

how to give shadow in dreamweaver to textfield area?

this is my code nd i want to give inner shadow for this

 Help with Code Tags 
 html Syntax (Toggle Plain Text) 
<label>
      <input name="textfield" type="text" size="25" maxlength="25" width="300px" />
      </label>
<label>
      <input name="textfield" type="text" size="25" maxlength="25" width="300px" />
      </label>

Last edited by peter_budo; 15 Days Ago at 4:27 am. Reason: Keep It Organized - For easy readability, always wrap programming code within posts in [code] (code blocks)

•

Join Date: Apr 2009

Posts: 800

Reputation: Airshow is on a distinguished road

Solved Threads: 113

Airshow

Offline

Practically a Posting Shark

16 Days Ago

Here's a demo of the border effects theoretically available from CSS.

 Help with Code Tags 
 html Syntax (Toggle Plain Text) 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Airshow :: Border Styles Demo</title>
<style type="text/css">
body { background-color: #e0e0e0; }
input {
	margin: 6px 0;
	width: 200px;
	height: 30px;
	border-width: 2px;
}
</style>
</head>
 
<body>
 
<input style="border-style:none"   name="textfield" type="text" size="25" value="none" /><br />
<input style="border-style:dotted" name="textfield" type="text" size="25" value="dotted" /><br />
<input style="border-style:dashed" name="textfield" type="text" size="25" value="dashed" /><br />
<input style="border-style:solid"  name="textfield" type="text" size="25" value="solid" /><br />
<input style="border-style:double" name="textfield" type="text" size="25" value="double" /><br />
<input style="border-style:groove" name="textfield" type="text" size="25" value="groove" /><br />
<input style="border-style:ridge"  name="textfield" type="text" size="25" value="ridge" /><br />
<input style="border-style:inset"  name="textfield" type="text" size="25" value="inset" /><br />
<input style="border-style:outset" name="textfield" type="text" size="25" value="outset" /><br />
 
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Airshow :: Border Styles Demo</title>
<style type="text/css">
body { background-color: #e0e0e0; }
input {
	margin: 6px 0;
	width: 200px;
	height: 30px;
	border-width: 2px;
}
</style>
</head>

<body>

<input style="border-style:none"   name="textfield" type="text" size="25" value="none" /><br />
<input style="border-style:dotted" name="textfield" type="text" size="25" value="dotted" /><br />
<input style="border-style:dashed" name="textfield" type="text" size="25" value="dashed" /><br />
<input style="border-style:solid"  name="textfield" type="text" size="25" value="solid" /><br />
<input style="border-style:double" name="textfield" type="text" size="25" value="double" /><br />
<input style="border-style:groove" name="textfield" type="text" size="25" value="groove" /><br />
<input style="border-style:ridge"  name="textfield" type="text" size="25" value="ridge" /><br />
<input style="border-style:inset"  name="textfield" type="text" size="25" value="inset" /><br />
<input style="border-style:outset" name="textfield" type="text" size="25" value="outset" /><br />

</body>
</html>

I say theoretically, because last time I ran a check, not all these border styles were available in all the major browsers. IIRC, IE was most comprehensive and Opera least - or was it FF?

To see what's going on in more detail, change border-width to something like 15px.

I think Dunceweaver will let you do all that - surely?

Airshow

50% of the solution lies in accurately describing the problem!

•

Join Date: Oct 2009

Posts: 12

Reputation: prachipote is an unknown quantity at this point

Solved Threads: 0

prachipote prachipote is offline

Offline

Newbie Poster

16 Days Ago

thanks.can we give top border bottom or left border to this box

Last edited by prachipote; 16 Days Ago at 1:49 am.

•

Join Date: Apr 2009

Posts: 800

Reputation: Airshow is on a distinguished road

Solved Threads: 113

Airshow

Offline

Practically a Posting Shark

16 Days Ago

Yes, standard CSS box model applies.

Top, bottom, left and right can be individually set but please note that with groove, ridge, inset and outset, the styles of the four edges are managed for you to give the right effect, which will probably be lost if you try to address the edges individually. But by all means try.

Airshow

50% of the solution lies in accurately describing the problem!