Information
Nothing fancy or complicated this time. Just a simple way of producing drop shadows that are fluid and require NO graphics.
Cascading Style Sheet
.out {
display:block;
background:#bbb;
border:1px solid #ddd;
position:relative;
margin:1em 0;
}
.in {
text-align:center;
background:#fff;
border:1px solid #555;
position:relative;
padding:5px;
font-weight:normal;
}
.ltin {
left:-5px;
}
.tpin {
top:-5px;
}
.narrow {width:8em;} /* change to suit */
h4 {font-weight:bold; color:#000;}
xhtml
<div class="out narrow">
<div class="in ltin tpin">
<h4>Narrow</h4>
<p>This is the text that goes in the middle.</p>
</div>
</div>
Copyright
You may use this method on your personal 'non-profit' web site without seeking my permission. A link back to CSSplay is always appreciated.
Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay.
If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.
CSS play Recommend
- Website Design
- Web Hosting
Plans start at only $2.99/month - www.thai.se
Thailand guide - Northstar Hire
Pre book private car hire, Gloucester UK - Register Domain Name
- Online PR-Portal Social Media News
Our Press releases you can read on OA News - SEO
- wholesale
- Phuket guide
A complete guide to Phuket - Web Banner Design
Unique designs from $20 - Pretronics UK
Pre Press Servicing - Myspace layouts and counter
Lyrics, polls, images & backgrounds -Free! - Leading digital agency
Search & social experts to increase traffic - SEO
Free SEO Analysis From SEO Consult - web designer





