Return to Snippet

Revision: 5347
at February 28, 2008 17:43 by cburyta


Initial Code
<style type="text/css">
/* --- build in a site using yui reset.css --- */
/* --- a series of divs that can be used to create expandable corners w/gradiant backgrounds --- */
.fourway-wrap {
	background-position: left top;
	background-repeat: repeat-y;
}
.fourway-wrap .fourway-rightbar {
	background-position: right top;
	background-repeat: repeat-y;
	
}
.fourway-wrap .fourway-header {
	background-position: left top;
	background-repeat: repeat-x;
}
.fourway-wrap .fourway-content {}
.fourway-wrap .fourway-footer {
	background-position: left bottom;
	background-repeat: repeat-x;
}
.fourway-wrap .upperleft {
	background-position: top left;
	background-repeat: no-repeat;
}
.fourway-wrap .upperright {
	background-position: top right;
	background-repeat: no-repeat;
}
.fourway-wrap .lowerleft {
	background-position: left bottom;
	background-repeat: no-repeat;
}
.fourway-wrap .lowerright {
	background-position: right bottom;
	background-repeat: no-repeat;
}


/* --- fourway colors ---- */

.white .fourway-wrap {
	background-color: #fff;
	background-image: url('img/body.gif');
}
.white .fourway-content 	{
	padding: .5em;

}
.white .fourway-rightbar { background-image: url('img/borderRight.gif'); }
.white .fourway-header 	{ background-image: url('img/header.gif'); }
.white .fourway-footer 	{ background-image: url('img/footer.gif'); }
.white .upperleft 		{ background-image: url('img/UpperLeft.gif'); }
.white .upperright 		{ background-image: url('img/UpperRight.gif'); }
.white .lowerleft 		{ background-image: url('img/LowerLeft.gif'); }
.white .lowerright 		{ background-image: url('img/LowerRight.gif'); }

</style>

<div class="searchChallenges fourway white">
	<div class="fourway-wrap">
	<div class="fourway-rightbar">
	<div class="fourway-header">
	<div class="fourway-footer">
	<div class="upperleft">
	<div class="upperright">
	<div class="lowerleft">
	<div class="lowerright">
		
		<div class="fourway-content">
			<h3>Content Here</h3>
		</div>
		
	</div></div></div></div></div></div></div></div>
	
</div>

Initial URL

                                

Initial Description

                                

Initial Title
CSS XHTML Rounded Corners

Initial Tags
css, textmate, xhtml

Initial Language
Other