case statement

Access has an IIF statement, SQL has the case. Want to display your bit data as "yes" or "no"? Enter the case statement! Example:


SELECT thisVariable, thatVariable,
CASE
WHEN likesApples = 1 THEN 'yes'
WHEN likesApples = 0 THEN 'no'
WHEN likesApples = 2 THEN 'not sure'
else 'not answered'
END AS appleVariable
FROM thatTable


organizing your stylesheet

UPDATE (7/12/09): Having read Andy Budd's CSS Mastery, I favor the structure he demonstrated. I highly recommend that book by the way. See sampleCSS.css in the resources folder of our repo.

----------------------------------

Organizing a css file is something we should probably think a little more about. I have tried various ways. If the stylesheet is very clearly organized you not only make it easier to read and modify, but also to debug later. Here is a sample I found online of a stylesheet for a free wordpress theme. I like the way the author organized their styles.

Do you have a good example? Blog about it! ;)

ARTICLES ON THE TOPIC ---> links at the bottom.


/*
Theme Name: statement
Theme URI: http://www.blogohblog.com
Description: The "Statement" WordPress theme has been built by Blog Oh! Blog and comes under a Creative Commons License.
Version: 1.0
Author: Jai Nischal Verma
Author URI: http://www.blogohblog.com
*/

/*+++++++ BODY +++++++*/
* { margin: 0px; padding: 0px; list-style:none; text-decoration:none; }
body { font-family: Arial; font-size: medium; color: #4d4b4c; background: #fff url(images/bkg.gif) repeat-x; }

/*+++++++ H1,H2,H3 HYPERLINKS +++++++*/
h3 { padding:10px 0 10px 0; font-size:14px;}
a:link { text-decoration: none; color: #006666; border: 0px;}
a:active {color : #006666; border: 0px;}
a:visited { color :#006666 ; border: 0px;}
a:hover { color:#333333; border: 0px;}
a:focus { outline: none;}
.clear { clear: both; }

/*+++++++ MAIN +++++++*/
#wrapper { width: 1000px; margin:auto; }
#frame,#content { width: 975px; margin:auto; }

/*+++++++ TOP +++++++*/
#header { height: 106px; width: 1000px; }
#logo { float: left; width: 210px; padding-top:30px; padding-left:10px; }
#logo h1{text-indent:-10000px;}
#logo h1 a{display:block; background: url(images/logo.gif) no-repeat; height:63px; outline:none;}
#topleft { float: right; height: 106px; width: 630px; }
#searchbox { float:right; width: 233px; height: 36px; background: url(images/s.gif) no-repeat; margin:20px 5px 0 0; }
#searchbox #s { float: left; margin: 4px 0 0 6px; border: 0; width: 200px; background: none; color:#999999; }
#searchbox #go { float: right; margin: 3px 4px 0 0; width:18px; height:18px; }

/*+++++++ NAVIGATION +++++++*/
#nav { float:right; padding-right:10px; margin-top:10px;}
#nav ul { }
#nav ul li {display:inline; height:35px; line-height:35px;}
#nav ul li.current_page_item a { background:url(images/navbg-acho.gif) repeat-x; color:#fff; }
#nav ul li.current_page_item a:hover{background:transparent;color:#fff;}
#nav ul li a { color:#fff;float:left; text-transform:uppercase; padding:0 0 0 20px;}
#nav ul li a:hover{background:none;color:#dadada; text-decoration:none;}

/*+++++++ INFOBAR +++++++*/
#infobar { height: 30px; width: 975px; line-height:30px; font-size:11px; margin-bottom:15px; }
#browse { float: left; width: 570px; background:url(images/folder.gif) no-repeat 0 6px; padding-left:22px; }
#rss { float: right; height: 30px; width: 383px; background:url(images/feed.gif) no-repeat right; }
#rss p { padding-right:22px; text-align:right;}

/*+++++++ ENTRY +++++++*/
#left { float: left; width: 570px; }
.entry { width: 540px;
padding:4%;
background:#fff;
border:1px solid #dadada;
margin-bottom:10px;
line-height:140%;
font-size:0.9em;
color:#4F5B5F;
}
.entry h2 { font: bold 1.3em "lucida grande",georgia,"Myriad Pro","Myriad Set","Myriad Apple",Myriad,Helvetica Nueue,Arial,Verdana,Sans-serif;letter-spacing: -1px;margin-bottom:0; margin-top:0;margin-left:-8px;}
.entry h2 a { color:#327489; }
.entry h2 a:hover {color:#B80EA2;}
.entry p { padding-bottom:10px;}
html>body .entry ul { padding: 0 0 0 30px; padding-left: 10px; }
html>body .entry li { margin: 7px 0 8px 10px; }
.entry ul li:before { content: "\00BB \0020"; }
.entry ol { padding-left: 2em; margin:0;}
.entry ol li { background:#fafafa; list-style-type: decimal; line-height: 120%; font-size:0.9em;}
.entry img {margin:0 10px 10px 10px;}
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignright, img.alignleft { padding: 11px; margin: 7px; display: inline;background:#EBE5EF; border:1px solid #C7BBD0; }
.alignright { float: right; }
.alignleft { float: left ;}
.allinfos { font-size:0.7em;font-family:georgia;font-style:italic; height:20px; padding-bottom:1.4em;margin-left:-8px;}
span.date {font-weight:bold;font-family:'lucida grande';font-style:normal; }
span.comments { background:url(images/comment.gif) no-repeat; padding-left:20px; }
span.category { background:url(images/posted.gif) no-repeat; padding-left:20px; }
.navigation { width: 540px; padding:10px; line-height:140%; font-size:11px; }
.entry p a {color:#9C0F6F;}


/*+++++++ SIDEBAR +++++++*/
#sidebarbottom { float:right; width: 400px; }
#right { float:left; width: 400px; }
#topsidebar { width: 380px; padding:0 10px 0 10px; border:1px solid #dadada; background:#fff; margin-bottom:10px; }
#lsidebar h2 { font-size:15px; margin-bottom:10px; color:#4c4c4c;}
#rsidebar h2 { font-size:15px; margin-bottom:10px; color:#4c4c4c; }
#lsidebar { float:left; width:160px; padding:5px; border:1px solid #dadada; background:#fff;}
#rsidebar { float:left; width:195px; padding:5px 10px 5px 10px; border:1px solid #dadada; background:#fff; margin-left:8px;}
#sidebarbottom ul{ margin:10px auto 20px;}
#sidebarbottom ul li{}
#sidebarbottom ul li ul{}
#sidebarbottom ul li ul li{display:block; background:url(images/bullet.gif) no-repeat 0 0; padding-left:24px; padding-bottom:5px; border-bottom:1px dotted #dadada;}
#sidebarbottom p{padding:0 5px;}
#lsidebar li, #rsidebar li {font-size:0.8em;}

/*+++++++ COMMENTS +++++++*/
.postmetadata { padding:5px; background:#feffe5; }
#commentform p { padding-bottom:10px;}
#commentform #author { border:1px solid #dadada; height:20px; width:200px; }
#commentform #email { border:1px solid #dadada; height:20px; width:200px; }
#commentform #url { border:1px solid #dadada; height:20px; width:200px;}
#commentform #comment { border:1px solid #dadada; height:200px; width:500px;}
.commentlist cite { background:#f9f9f9; padding:5px 5px 5px 10px; }
.commentlist cite a { color:#333;}
.commentlist .ctext { background:url(images/doth.gif) repeat-x bottom; font-size:11px;}

/*+++++++ FOOTER +++++++*/
#footer { background: #222222 url(images/footer.gif) repeat-x; width: 100%; margin:15px auto 0px; height:100px; font-size:10px; }
#foo { background:url(images/foobg.gif) no-repeat right; width: 955px; margin:auto; padding:10px; height:80px; color:#fff; }
#foo a:link { color : #FF9900; border: 0px;}
#foo a:active { text-decoration: underline; color : #FF9900; border: 0px;}
#foo a:visited { color : #FF9900; border: 0px;}
#foo a:hover {color: #FFFFFF; border: 0px;}
#foo ul { float:left; margin-top:10px; }
#foo ul li {display:inline; height:35px; line-height:35px; font-weight:700;}
#foo ul li.current_page_item a { background:url(images/navbg-acho.gif) repeat-x; color:#fff; }
#foo ul li.current_page_item a:hover{background:transparent;color:#fff;}
#foo ul li a { color:#fff;float:left; padding:0 20px 0 0;}
#foo ul li a:hover{background:none;color:#dadada; text-decoration:none;}

/**************** Misc *********************/
acronym, abbr, span.caps { cursor: help; }
acronym, abbr { border-bottom: 1px dashed #999; }
blockquote { margin: 15px 30px 15px 10px; padding-left: 20px; border-left: 5px solid #ddd; }
blockquote cite { margin: 5px 0 0; display: block; }
.center { text-align: center; }
hr { display: none; }
a img { border: none; }
pre {border: solid 1px #9a9a9a;color: blue;margin: 10px;padding:10px;background: #f3f2ed}
code {font-size:1.0em;color: #000}

/**************** Gallery *********************/
.gallery {text-align:center;}
.gallery img {padding:3px;}
.attachment {text-align:center;}
.attachment img { padding:5px; border:1px solid #999999;}
.imgnav {text-align:center;}
.imgleft {float:left;}
.imgleft img{ padding:5px; border:1px solid #999999;}
.imgright {float:right;}
.imgright img{ padding:5px; border:1px solid #999999;}


- 5 Tips for Organizing Your CSS
-Tips from Doug Bowman

Firefox add-ons: source code viewing tools

Two helpful tools for viewing the source code of any pages:
View formatted source: https://addons.mozilla.org/en-US/firefox/addon/697
View source chart: https://addons.mozilla.org/en-US/firefox/addon/655