One of the benefits to having a .Text-based blog is that it is fairly easy to get it set up and running quickly and join the ever growing community of .NET bloggers. When you configure your blog for the first time you have to choose a default skin template to apply to your blog to control the general layout and CSS styles that will be applied. If you want to go beyond the default styles in the skin you choose for your blog, you're on your own to figure out how to make that happen.
Since I'm never happy leaving good enough alone, or not really understanding how something works under the covers, figuring out how to further tweak my blog's appearance provided me a great opportunity to delve into source of .Text and figure out how it all works. My journey thus far, mind you, has been limited in scope to figuring out how and when the secondary CSS styles are applied to your blog (see Admin/Options/Configure/Custom CSS Selectors).
When rendering your blog, as I discovered, .Text looks at the default skin you have chosen and if that default skin template specifies its own secondary CSS stylesheet, then any overrides you enter into the Custom CSS Selectors textbox on the configuration page are ignored. How do you know which skins have a secondary template? If you have the .Text source code, look at the skins.config file in the DottextWeb/Skins directory. This file will list all the available skins and which have a secondary CSS file.
For instance, if you'd like to change the font style, border margins, styles, etc. you can easily apply your own CSS styles to override the default styles of the template you have chosen for your blog. If you'd like to modify the actual layout of your blog, then you're options are pretty much limited to one of the default skins and whatever you can find to override. The quickest way to figure out which tags you want to override is to view the page source and to look at the class element of the different styles specified, such as post or postfoot. Once you find one that you'd like to override, it is as easy as writing a brief snippet like this and placing it in the "Static News/Announcement" textbox on your blog's "Configure" page:
<style type="text/css">
.post {
font-size : 9pt;
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
margin : 0px;
line-height: 2.85ex;
}
.postfoot {
border-bottom : 1px dashed #C6C6C6;
text-align: right;
}
</style>
Also, be sure to preview your changes in Mozilla and other recent browsers to ensure a consistent appearance across browsers.
Helpful Links