Reformat your CSS with CSSTidy

Below you’ll find a custom implementation of CSSTidy, stripped of the optimization methods and simply acting as a straightforward method of reformatting your CSS.

I put this tool together quickly to act as a resource for those frustrated when collaborating on CSS documents. Each developer has a specific way of writing CSS, and this tool has been put together to assist in making it painless to quickly reformat CSS to your liking, and then back again when you’re done working. It does nothing in the way of optimization, just reformatting.

Currently at version 0.1, the tool is very young, and over time I’d like to add more default formatting templates, and possibly develop a more straightforward templating syntax.
CSS Reformatter 0.1 Based on CSSTidy 1.3
CSS
Paste CSS body, td, input, select { /* color: #0000CD; */ font-size: 14px; font-family: Georgia, "Times New Roman", Times, serif; } body{ background-image: url(/Images/KeeiLaniHawaii/background.jpg); background-repeat: x y; } #header { color: #D82787; font-style: italic; font-weight: bold; background-image: url(/Images/KeeiLaniHawaii/header_v2.png); background-repeat: no-repeat; background-position: top left; text-align: center; padding-top: 140px; } #header p{ color: #65A4AC; font-size: 12px; font-style: italic; font-weight: normal; width: 500px; text-align: center; margin: 20px auto; } #navigation { text-align: center; /* background: #328690; */ padding-bottom: 4px; padding-top: 4px; color: #fff; } #navigation a { color: #328690; font-weight: bold; text-decoration: none; padding-top: 4px; padding-bottom: 4px; padding-left: 8px; padding-right: 8px; } #navigation a:hover { color: #99C3C8; /* background-color: #99C3C8; */ } #navigation a.selected { color: #D82787; /* background-color: #fff; */ } #containerOne { width: 782px; margin-left: auto; margin-right: auto; margin-top: 16px; margin-bottom: 16px; /* border: 1px solid #328690; */ /* background-color: #fff; */ } #content { margin-left: 21px; margin-right: 21px; margin-top: 16px; margin-bottom: 16px; color: ; } #content a { color: #D82787; } #content a:hover { color: #D82787; } #content h1, #content .PageTitle { color: #65A4AC; font-size: 20px; padding: 0px; margin: 0px; margin-bottom: 17px; font-weight: bold; } #content h2 { color: #132C63; font-size: 19px; padding: 0px; margin: 0px; margin-bottom: 16px; font-weight: bold; } #content h3 { color: #0A1836; font-size: 18px; padding: 0px; margin: 0px; margin-bottom: 15px; font-weight: bold; } #content h4 { color: #02050A; font-size: 17px; padding: 0px; margin: 0px; margin-bottom: 14px; font-weight: bold; } #content p, div { padding: 0px; margin: 0px; /* margin-bottom: 15px; */ } #content ul, ol { /* margin-bottom: 15px; */ } #copyright { text-align: center; margin-top: 16px; margin-bottom: 16px; font-size: 10px; color: #999999; } #copyright a { color: #666666; } #copyright a:hover { color: #333333; } #content input[type=submit] { background:white; width:160px; font-size: 11px; margin:12px 0; } #content input[type=submit]:hover { background: #CCCCCC; color: black; } #content .ArticleDate,#content .ArticleSummary .ArticleDate { font-size: 11px; margin-bottom: 7px; } #content .ArticleTitle,#content .ArticleSummary .ArticleTitle { font-weight: bold; font-size: 17px; margin-bottom: 7px; } #content .ArticleSubTitle,#content .ArticleSummary .ArticleSubTitle { font-style: italic; font-size: 15px; margin-bottom: 7px; } #content .ArticleByLine,#content .ArticleSummary .ArticleByLine { font-size: 13px; } #content .ArticleSummary a { color: #328690; } #content .ArticleContent { } #content .ArticleContent p{ margin: 10px 5px 10px 0; } #content .ArticleComments .ArticleCommentsOutput { padding-right: 32px; } #content .ArticleComments .ArticleCommentsOutput .Headline { font-weight: bold; font-size: 17px; margin-bottom: 19px; } #content .ArticleComments .ArticleCommentsOutput .ArticleComment { margin-left: 21px; margin-right: 21px; margin-bottom: 31px; } #content .ArticleComments .ArticleCommentsOutput .ArticleComment .info { font-style: italic; font-weight: bold; margin-left: 21px; font-size: 12px; } #content .ArticleComments .ArticleCommentsInput { width: 250px; background-color: #CCCCCC; float: right; } #content .ArticleComments .ArticleCommentsInput .Headline { font-weight: bold; font-size: 16px; margin-left: 18px; margin-top: 13px; } #content .ArticleComments .ArticleCommentsInput #ArticleCommentForm { margin-left: 16px; margin-right: 16px; } #content .ArticleComments .ArticleCommentsInput #ArticleCommentForm div { margin: 0; } #content .ArticleComments .ArticleCommentsInput #ArticleCommentForm, #content .ArticleComments .ArticleCommentsInput #ArticleCommentForm input, #content .ArticleComments .ArticleCommentsInput #ArticleCommentForm textarea { font-size: 12px; } #content .ArticleSummary .ArticleDate, #content .ArticleSummary .ArticleTitle { margin-bottom: 3px; } #content .ArticleSummary .ArticleTitle { font-size: 18px; font-weight: bold; } #content .Review { margin-left: 21px; margin-right: 21px; margin-top: 14px; margin-bottom: 0px; } #content .ReviewDate { font-size: 11px; font-weight: bold; } #content .ReviewByLine { font-size: 12px; font-weight: bold; font-style: italic; } #content .ReviewContent { font-size: 13px; margin-top: 7px; padding-left: 21px; padding-right: 21px; } #content .EventName { font-weight: bold; font-size: 110%; color: #653D00; } #content .EventTitle { font-weight: bold; font-style: italic; } #content li.EventListing, #content li.DayOfWeek li.EventListing { margin-bottom: 21px; } #content .EventDescription, #content li.DayOfWeek .EventDescription { font-size: 90%; margin-left: 13px; margin-right: 13px; margin-top: 10px; margin-bottom: 10px; } #content .EventFee { font-size: 90%; margin-left: 13px; margin-right: 13px; margin-bottom: 10px; } #content .EventLocation, #content li.DayOfWeek .EventLocation { font-style: italic; font-size: 80%; } #content .EventContact, #content li.DayOfWeek .EventContact { font-style: italic; font-size: 80%; } #content li.DayOfWeek { font-weight: bold; margin-bottom: 21px; } #content li.DayOfWeek span { font-size: 120%; } #content li.DayOfWeek li.EventListing { font-weight: normal; } #content li.DayOfWeek ul { margin-top: 21px; } #content hr { margin: 30px auto; color: #328690; } #footer { text-align: center; padding-bottom: 4px; padding-top: 4px; line-height: 16px; color: #328690; } #footer a { color: #328690; font-weight: bold; text-decoration: none; padding-top: 4px; padding-bottom: 4px; padding-left: 8px; padding-right: 8px; } #footer a:hover { color: #99C3C8; } #footer a.selected { color: #D82787; } #infoRequestForm { font-size:11px; width:440px; margin:16px auto; text-align:center; border:1px solid #CCCCCC; background:#CCE1E3; } #infoRequestForm form { } #infoRequestForm legend { display: none; } #infoRequestForm fieldset { border:0; margin:0; } #infoRequestForm label { width:160px; text-align:left; float:left; margin:0 10px 0 0; padding:2px 0 0; } #infoRequestForm textarea{ width: 340px; height: 65px; float:left; } #infoRequestForm label[for=Comments] { width:150px; text-align:right; float:left; margin:0 10px 0 0; padding:2px 0 0; } #infoRequestForm input { width:160px; padding:2px; margin:0 0 10px; color:#3a3a3a; } /* #infoRequestForm #NumberInParty { width:20px; } */ #infoRequestForm input[type=checkbox] { width:14px; margin:0; display:inline; } #infoRequestForm input[type=radio] { width:30px; margin:0; } #infoRequestForm select { font-size:12px; } #infoRequestForm input.button { background:white; width:160px; font-size: 11px; margin:12px 0; } #infoRequestForm input.button:hover { background:#CCCCCC; color:black; } #infoRequestForm #City { width:75px; } #infoRequestForm #State { width:15px; } #infoRequestForm #Zip { width:35px; } #infoRequestForm #centerTop { width:350px; text-align:left; margin:12px auto; } #infoRequestForm #centerBottom { width:350px; text-align:center; margin:12px auto; } #infoRequestForm #formError { font-color:red; } /* #infoRequestForm #arrivalSelection { margin:0 10px 0 0; } #infoRequestForm #departureSelection { margin:0 10px 0 0; } */ #eNewsletterForm { font-size:11px; width:500px; border:1px solid #CCCCCC; background: #CCE1E3; margin:18px auto; padding:0; } #eNewsletterForm form { } #eNewsletterForm legend { display:none; } #eNewsletterForm fieldset { border:0; padding:0; } #eNewsletterForm label { width:150px; text-align:left; float:left; margin:0 10px 0 0; padding:2px 0 0; } #eNewsletterForm input { width:150px; padding:2px; margin:0 0 10px; color:#3a3a3a; } #eNewsletterForm input[type=checkbox] { width:14px; margin:0; display:inline; } #eNewsletterForm input[type=radio] { width:14px; margin:0; display:inline; color:#fff; background:#fff; } #eNewsletterForm input.button { background:white; width:150px; font-size:11px; } #eNewsletterForm input.button:hover { background:#CCCCCC; color:black; } #eNewsletterForm p { text-align:center; } #eNewsletterForm #eNewsletterTop { width:320px; text-align:center; margin:12px auto; } #eNewsletterForm #eNewsletterMiddle { text-align:center; margin:12px auto; } #eNewsletterForm #eNewsletterBottom { padding:6px; text-align:center; background:#EEEEEE; margin:0 auto; } #linksList li a{ color: #328690; } .ArticleCommentStatus{ font-weight:bold; margin:10px; } .ArticleCommentError{ color:red; font-weight:bold; margin:10px; } .ArticleCommentSection{ font-weight:bold; float:right; margin:0 18px 0 0; } .ArticleCommentSectionCount{ font-weight:bold; } .ArticleSeparator{ margin:30px auto; clear: both; } .ArticleComment{ margin:20px auto; } .footerimage{ margin:10px auto; }
Format:
Custom template
Reformat CSS

body,td,input,select {

	
/* color: #0000CD; */
	font-size:14px;
	font-family:Georgia, "Times New Roman", Times, serif;
}

body {
	background-image:url(/Images/KeeiLaniHawaii/background.jpg);
	background-repeat:x y;
}

#header {
	color:#D82787;
	font-style:italic;
	font-weight:bold;
	background-image:url(/Images/KeeiLaniHawaii/header_v2.png);
	background-repeat:no-repeat;
	background-position:top left;
	text-align:center;
	padding-top:140px;
}

#header p {
	color:#65A4AC;
	font-size:12px;
	font-style:italic;
	font-weight:normal;
	width:500px;
	text-align:center;
	margin:20px auto;
}

#navigation {
	text-align:center;

	
/* background: #328690; */
	padding-bottom:4px;
	padding-top:4px;
	color:#fff;
}

#navigation a {
	color:#328690;
	font-weight:bold;
	text-decoration:none;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:8px;
	padding-right:8px;
}

#navigation a:hover {
	color:#99C3C8;

	
/* background-color: #99C3C8; */
}

#navigation a.selected {
	color:#D82787;

	
/* background-color: #fff; */
}

#containerOne {
	width:782px;
	margin-left:auto;
	margin-right:auto;
	margin-top:16px;
	margin-bottom:16px;

	
/* border: 1px solid #328690; */

	
/* background-color: #fff; */
}

#content {
	margin-left:21px;
	margin-right:21px;
	margin-top:16px;
	margin-bottom:16px;
	color:;
}

#content a {
	color:#D82787;
}

#content a:hover {
	color:#D82787;
}

#content h1,#content .PageTitle {
	color:#65A4AC;
	font-size:20px;
	padding:0;
	margin:0;
	margin-bottom:17px;
	font-weight:bold;
}

#content h2 {
	color:#132C63;
	font-size:19px;
	padding:0;
	margin:0;
	margin-bottom:16px;
	font-weight:bold;
}

#content h3 {
	color:#0A1836;
	font-size:18px;
	padding:0;
	margin:0;
	margin-bottom:15px;
	font-weight:bold;
}

#content h4 {
	color:#02050A;
	font-size:17px;
	padding:0;
	margin:0;
	margin-bottom:14px;
	font-weight:bold;
}

#content p,div {
	padding:0;
	margin:0;

	
/* margin-bottom: 15px; */
}

#content ul,ol {

	
/* margin-bottom: 15px; */
}

#copyright {
	text-align:center;
	margin-top:16px;
	margin-bottom:16px;
	font-size:10px;
	color:#999999;
}

#copyright a {
	color:#666666;
}

#copyright a:hover {
	color:#333333;
}

#content input[type=submit] {
	background:white;
	width:160px;
	font-size:11px;
	margin:12px 0;
}

#content input[type=submit]:hover {
	background:#CCCCCC;
	color:black;
}

#content .ArticleDate,#content .ArticleSummary .ArticleDate {
	font-size:11px;
	margin-bottom:7px;
}

#content .ArticleTitle,#content .ArticleSummary .ArticleTitle {
	font-weight:bold;
	font-size:17px;
	margin-bottom:7px;
}

#content .ArticleSubTitle,#content .ArticleSummary .ArticleSubTitle {
	font-style:italic;
	font-size:15px;
	margin-bottom:7px;
}

#content .ArticleByLine,#content .ArticleSummary .ArticleByLine {
	font-size:13px;
}

#content .ArticleSummary a {
	color:#328690;
}

#content .ArticleContent {
}

#content .ArticleContent p {
	margin:10px 5px 10px 0;
}

#content .ArticleComments .ArticleCommentsOutput {
	padding-right:32px;
}

#content .ArticleComments .ArticleCommentsOutput .Headline {
	font-weight:bold;
	font-size:17px;
	margin-bottom:19px;
}

#content .ArticleComments .ArticleCommentsOutput .ArticleComment {
	margin-left:21px;
	margin-right:21px;
	margin-bottom:31px;
}

#content .ArticleComments .ArticleCommentsOutput .ArticleComment .info {
	font-style:italic;
	font-weight:bold;
	margin-left:21px;
	font-size:12px;
}

#content .ArticleComments .ArticleCommentsInput {
	width:250px;
	background-color:#CCCCCC;
	float:right;
}

#content .ArticleComments .ArticleCommentsInput .Headline {
	font-weight:bold;
	font-size:16px;
	margin-left:18px;
	margin-top:13px;
}

#content .ArticleComments .ArticleCommentsInput #ArticleCommentForm {
	margin-left:16px;
	margin-right:16px;
}

#content .ArticleComments .ArticleCommentsInput #ArticleCommentForm div {
	margin:0;
}

#content .ArticleComments .ArticleCommentsInput #ArticleCommentForm,#content .ArticleComments .ArticleCommentsInput #ArticleCommentForm input,#content .ArticleComments .ArticleCommentsInput #ArticleCommentForm textarea {
	font-size:12px;
}

#content .ArticleSummary .ArticleDate,#content .ArticleSummary .ArticleTitle {
	margin-bottom:3px;
}

#content .ArticleSummary .ArticleTitle {
	font-size:18px;
	font-weight:bold;
}

#content .Review {
	margin-left:21px;
	margin-right:21px;
	margin-top:14px;
	margin-bottom:0;
}

#content .ReviewDate {
	font-size:11px;
	font-weight:bold;
}

#content .ReviewByLine {
	font-size:12px;
	font-weight:bold;
	font-style:italic;
}

#content .ReviewContent {
	font-size:13px;
	margin-top:7px;
	padding-left:21px;
	padding-right:21px;
}

#content .EventName {
	font-weight:bold;
	font-size:110%;
	color:#653D00;
}

#content .EventTitle {
	font-weight:bold;
	font-style:italic;
}

#content li.EventListing,#content li.DayOfWeek li.EventListing {
	margin-bottom:21px;
}

#content .EventDescription,#content li.DayOfWeek .EventDescription {
	font-size:90%;
	margin-left:13px;
	margin-right:13px;
	margin-top:10px;
	margin-bottom:10px;
}

#content .EventFee {
	font-size:90%;
	margin-left:13px;
	margin-right:13px;
	margin-bottom:10px;
}

#content .EventLocation,#content li.DayOfWeek .EventLocation {
	font-style:italic;
	font-size:80%;
}

#content .EventContact,#content li.DayOfWeek .EventContact {
	font-style:italic;
	font-size:80%;
}

#content li.DayOfWeek {
	font-weight:bold;
	margin-bottom:21px;
}

#content li.DayOfWeek span {
	font-size:120%;
}

#content li.DayOfWeek li.EventListing {
	font-weight:normal;
}

#content li.DayOfWeek ul {
	margin-top:21px;
}

#content hr {
	margin:30px auto;
	color:#328690;
}

#footer {
	text-align:center;
	padding-bottom:4px;
	padding-top:4px;
	line-height:16px;
	color:#328690;
}

#footer a {
	color:#328690;
	font-weight:bold;
	text-decoration:none;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:8px;
	padding-right:8px;
}

#footer a:hover {
	color:#99C3C8;
}

#footer a.selected {
	color:#D82787;
}

#infoRequestForm {
	font-size:11px;
	width:440px;
	margin:16px auto;
	text-align:center;
	border:1px solid #CCCCCC;
	background:#CCE1E3;
}

#infoRequestForm form {
}

#infoRequestForm legend {
	display:none;
}

#infoRequestForm fieldset {
	border:0;
	margin:0;
}

#infoRequestForm label {
	width:160px;
	text-align:left;
	float:left;
	margin:0 10px 0 0;
	padding:2px 0 0;
}

#infoRequestForm textarea {
	width:340px;
	height:65px;
	float:left;
}

#infoRequestForm label[for=Comments] {
	width:150px;
	text-align:right;
	float:left;
	margin:0 10px 0 0;
	padding:2px 0 0;
}

#infoRequestForm input {
	width:160px;
	padding:2px;
	margin:0 0 10px;
	color:#3a3a3a;
}


	
/*
#infoRequestForm #NumberInParty {
	width:20px;
}
*/
#infoRequestForm input[type=checkbox] {
	width:14px;
	margin:0;
	display:inline;
}

#infoRequestForm input[type=radio] {
	width:30px;
	margin:0;
}

#infoRequestForm select {
	font-size:12px;
}

#infoRequestForm input.button {
	background:white;
	width:160px;
	font-size:11px;
	margin:12px 0;
}

#infoRequestForm input.button:hover {
	background:#CCCCCC;
	color:black;
}

#infoRequestForm #City {
	width:75px;
}

#infoRequestForm #State {
	width:15px;
}

#infoRequestForm #Zip {
	width:35px;
}

#infoRequestForm #centerTop {
	width:350px;
	text-align:left;
	margin:12px auto;
}

#infoRequestForm #centerBottom {
	width:350px;
	text-align:center;
	margin:12px auto;
}

#infoRequestForm #formError {
	font-color:red;
}


	
/*
#infoRequestForm #arrivalSelection {
	margin:0 10px 0 0;	
}

#infoRequestForm #departureSelection {
	margin:0 10px 0 0;	
}

*/
#eNewsletterForm {
	font-size:11px;
	width:500px;
	border:1px solid #CCCCCC;
	background:#CCE1E3;
	margin:18px auto;
	padding:0;
}

#eNewsletterForm form {
}

#eNewsletterForm legend {
	display:none;
}

#eNewsletterForm fieldset {
	border:0;
	padding:0;
}

#eNewsletterForm label {
	width:150px;
	text-align:left;
	float:left;
	margin:0 10px 0 0;
	padding:2px 0 0;
}

#eNewsletterForm input {
	width:150px;
	padding:2px;
	margin:0 0 10px;
	color:#3a3a3a;
}

#eNewsletterForm input[type=checkbox] {
	width:14px;
	margin:0;
	display:inline;
}

#eNewsletterForm input[type=radio] {
	width:14px;
	margin:0;
	display:inline;
	color:#fff;
	background:#fff;
}

#eNewsletterForm input.button {
	background:white;
	width:150px;
	font-size:11px;
}

#eNewsletterForm input.button:hover {
	background:#CCCCCC;
	color:black;
}

#eNewsletterForm p {
	text-align:center;
}

#eNewsletterForm #eNewsletterTop {
	width:320px;
	text-align:center;
	margin:12px auto;
}

#eNewsletterForm #eNewsletterMiddle {
	text-align:center;
	margin:12px auto;
}

#eNewsletterForm #eNewsletterBottom {
	padding:6px;
	text-align:center;
	background:#EEEEEE;
	margin:0 auto;
}

#linksList li a {
	color:#328690;
}

.ArticleCommentStatus {
	font-weight:bold;
	margin:10px;
}

.ArticleCommentError {
	color:red;
	font-weight:bold;
	margin:10px;
}

.ArticleCommentSection {
	font-weight:bold;
	float:right;
	margin:0 18px 0 0;
}

.ArticleCommentSectionCount {
	font-weight:bold;
}

.ArticleSeparator {
	margin:30px auto;
	clear:both;
}

.ArticleComment {
	margin:20px auto;
}

.footerimage {
	margin:10px auto;
}

#eNewsletterForm #eNewsletterMiddle label[for=emailAddress] {
	float: none;
	text-align: left;
	display: block;
	width: 160px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
}