CSS font stacks, developer FAQs & web standards
Site navigation below

Your banner ad here

Data recovery software tools & file recovery utilities to recover lost data

WestNIC provides reliable web hosting services

This is not a blog, it is a technical change log for the Code Style site with a searchable archive of previous entries. Technical implementation notes that shed light on when, why and how the site has evolved since 2000.

This log is sometimes updated several times per week, sometimes with a long overdue backlog of items. Many log entries refer to the Code Style Java package that delivers the servlet services and utilities used to manage this site.

RSS news feed Follow the latest entries to the site log.

Reverse chronology

Font stack builder paste-in release, 9th May 2010

Made finishing touches and final styling to the paste-in font stack builder release. Added form.FontFamily textarea to the grouped selector for monospace fonts with the Lucida Sans Typewriter based font stack, and to the selector for large font-size. Created a new rule to set the text area's width to 96% of its .MenuBox container.

code,
pre,
form.FontFamily textarea
{
  font-family:      "Lucida Sans Typewriter", "Lucida Console", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", Consolas, "Andale Mono", "Monotype.com", Monaco, Fixed, monospace;
}

h3.Options, .CTA, form.FontFamily textarea
{
  font-size:        1.40em;
}

form.FontFamily textarea {
  width:            96%;
}
      

Actions: Ask a question about this post, seek clarification or offer a correction.

Ant EPUB compilation target, 8th May 2010

Created a new Ant target to compile working draft eBooks in International Digital Publishing Forum EPUB format. Needs to be zipped in a single operation to ensure the mimetype file is the first entry in the zip file structure and is not compressed.

<delete file="./OnePercentBetter.epub"/>
<zip destfile="./OnePercentBetter.epub" compress="No" whenempty="skip">
  <fileset dir="." includes="mimetype"/>
  <zipfileset dir="./OEBPS" prefix="OEBPS" />
  <zipfileset dir="./META-INF" prefix="META-INF" />
</zip>
      

Published the monthly font survey results with the addition of several new fonts, including the Mac OS X Snow Leopard fantasy font Chalkduster and monospace font Menlo, and Microsoft's Segoe Print and Segoe Script. The latest survey results also include recently added non-Latin fonts for Windows and Mac OS in the Sampler.css style sheet.

.AdobeFangsongStd{font-family: "Adobe Fangsong Std";}
.AdobeHeitiStd{font-family: "Adobe Heiti Std";}
.AdobeKaitiStd{font-family: "Adobe Kaiti Std";}
.AdobeMingStd{font-family: "Adobe Ming Std";}
.AdobeMyungjoStd{font-family: "Adobe Myungjo Std";}
.AdobeSongStd{font-family: "Adobe Song Std";}
.ArabicTypesetting{font-family: "Arabic Typesetting";}
.Chalkduster{font-family: Chalkduster;}
.DaunPenh{font-family: DaunPenh;}
.DokChampa{font-family: DokChampa;}
.Euphemia{font-family: Euphemia;}
.GungSeo{font-family: GungSeo;}
.HeitiSC{font-family: "Heiti SC";}
.Heiti TC{font-family: "Heiti TC";}
.HiraginoKakuGothicProN{font-family: "Hiragino Kaku Gothic ProN";}
.HiraginoKakuGothicStdN{font-family: "Hiragino Kaku Gothic StdN";}
.HiraginoMaruGothicProN{font-family: "Hiragino Maru Gothic ProN";}
.HiraginoMinchoProN{font-family: "Hiragino Mincho ProN";}
.IskoolaPota{font-family: "Iskoola Pota";}
.Kailasa{font-family: Kailasa;}
.Kalinga{font-family: Kalinga;}
.Kokonor{font-family: Kokonor;}
.Menlo{font-family: Menlo;}
.MicrosoftYiBaiti{font-family: "Microsoft Yi Baiti";}
.MongolianBaiti{font-family: "Mongolian Baiti";}
.Nyala{font-family: Nyala;}
.SegoePrint{font-family: "Segoe Print";}
.SegoeScript{font-family: "Segoe Script";}
      

Latest: Build a better CSS font stack with our font survey results:

Updated the FontStack servlet to enable people to paste font-family declarations into the font stack builder directly, class version 1.3. Adapted the page layout through a new appendFontArea(StringBuffer, HttpServletRequest, List, String, String) method and amended various pieces of microcopy to support the new scheme. Also amended the servlet doPost() method to pass the stack parameter through the getCleanFontFamilyStack(List) method, so pasted font stacks are trimmed to recognised font family names, which also serves as a security precaution. Added delimiters : and ; to the StringTokenizer that extracts font family names from the submitted stack parameter and applied the String trim() method to remove any white space either side of the names.

Added a getQuotedString(HttpServletRequest, String) method to the ServletUtilities class that drops double and single quotes in request parameters so font family names are reduced to the name only. This required a cascade of changes to the overloaded getFirstParameter(), filter() and filterLatin1() methods to pass the arguments through.

Created a new getGeneric(final String stackList) method to extract a generic font family name from pasted-in font stacks and add to the generic parameter of the new font stack URL.

Renamed the HTTP monitor class from QuartzTest to QuartzHttpMonitor to avoid it being run as a JUnit test. Updated the Windows batch script that runs the HTTP monitor to reference the new class name.

Actions: Ask a question about this post, seek clarification or offer a correction.

CSS3 call to action style, 1st May 2010

Created a new call to action style to apply to the text ad service page, with largely the same rules as the .BoxMenu selector except a yellow background, large font size, large border-radius and box-shadow declarations. Updated layout and sequence of content on the page. Also added the option to join a text ad mailing list as part of the enquiries feedback form. Also added an email newsletter notification option to the text ad enquiry form.

#Content .CTA {
  padding:          0% 2% 0% 2%;
  margin-top:       3%;
  margin-bottom:    4%;
}

.CTA {
  background:       #FFC;
  color:            #000;
  border:           solid 1px #999;
}

.CTA {
  border-radius:    15px;
  box-shadow:       0px 1px 3px #999;
}
h3.Options, .CTA {
  font-size:        1.40em;
}
      

Added a rule to the print style sheet,CSPrint.css, to hide the call to action content from printed output.

/*
  Hide unnecessary selectors.
*/
.WideNav, #Sidebar, #Footbar, form,
.TopLink, .AlphaLinks, .NavBar,
.RgtBox, .LftBox, .RgtPicBox,
LftPicBox, .MenuBox, .CTA, #SiteSearch, .URI,
.TextAd, #Footer .Button, .Sponsor,
.SponsorZone, #LinkShare, img.Logo,
.AdButtonBar {
  display:          none;
}
      

Also added the CSS3 extension style properties for box-shadow and border-radius to the css3-ExtensionStyles.js script.

setBorderRadiusByClass('CTA',         '15px');
setBoxShadowByClass('CTA',            '0px 1px 3px #999');
      

Created a new working draft Site Manager Apache HTTPd Web server subsection index with Apache HTTPd Web server contents page.

Actions: Ask a question about this post, seek clarification or offer a correction.

Previously on Code Style

Find technical implementation notes on all aspects of the Code Style site.

Add this page to your chosen social bookmarking service

Style warning, please read

Home · CSS · Java · Javascript · HTML · Help · Log