CSS Popups, Scalable Tabs and Favelets
CSS Snippets
Absolutely Positioned Pure CSS PopUps - good cross-browser support.
Pure CSS Scalable Tabs - if you need your tabbed navigation to scale too.
slayeroffice | Style Sheet Tweak Favelet" - another great tool, with a nice interface. Great for debugging layouts.
January 09, 2005 | Permalink | Comments (0) | TrackBack (0)
Styling Form Widgets
CSS Snippets
The Man in Blue > Styling Form Widgets - amazing what a little CSS can do for a submit button!
April 27, 2004 | Permalink | Comments (0) | TrackBack (1)
Accessible Stylish form layout
CSS Snippets
Accessible, stylish form layouts - semantic, accessible and usable. Templates can be seen here.
March 24, 2004 | Permalink | Comments (1) | TrackBack (0)
Simple clean CSS rollover menus with lists
CSS Snippets
::: THE IMPOSTER ::: Simple clean CSS rollover menus with lists is a nice collection of CSS list menus in a variety of styles.
Added: Lots of other CSS goodness on this site as well.
February 18, 2004 | Permalink | Comments (1) | TrackBack (0)
Stylish CSS iframe lookalikes
CSS Snippets
Stylish css iframe lookalikes - nice!
January 21, 2004 | Permalink | Comments (1) | TrackBack (0)
Pure CSS Tooltips
CSS Snippets
Pure css tooltips that even print. At least in Gecko-based browsers.
January 20, 2004 | Permalink | Comments (0) | TrackBack (0)
CSS Frames
CSS Snippets
About CSS Frames. Works like frames but built with CSS and alternate style sheets. See the demo here.January 07, 2004 | Permalink | Comments (0) | TrackBack (0)
Styling Web Forms with CSS
CSS Snippets
July 15, 2003 | Permalink | Comments (1) | TrackBack (0)
CSS Drop Shadow Effects
CSS Snippets
Lurking in Shadows: CSS and drop shadow effects.
July 11, 2003 | Permalink | Comments (0) | TrackBack (0)
Sidenotes
CSS Snippets
From Sidenotes - very nice. (Won't work on IE)
June 17, 2003 | Permalink | Comments (0) | TrackBack (0)
CSS Headings 50 ways
CSS Snippets
CSS Headings 50 ways - Illustrations and css for 50 different ways to do your headings with CSS.
May 01, 2003 | Permalink | Comments (0) | TrackBack (0)
CSS Rounded Boxes
CSS Snippets
Found at Blog-Fu ... CSS Rounded Boxes/Corners ... done six ways!
March 21, 2003 | Permalink | Comments (2) | TrackBack (0)
CSS for Form Elements
CSS Snippets
CSS Form effects tutorial very nicely explains how to spruce up your form elements.
Lots more useful tips on the site as well.
December 31, 2002 | Permalink | Comments (2) | TrackBack (0)
Alternate Style Sheets for different screen sizes
CSS Snippets
In this thread at the mt forum, gdesanto outlines how to serve up different style sheets depending on the screen resolution of the visitor's browser. movabletype.org : Support Forum Link
November 10, 2002 | Permalink | Comments (0) | TrackBack (0)
Stretchable Graphical Borders
CSS Snippets
Someone posted a link to this in the mt forums, for someone looking to add shadows to thumbnails of different sizes. Interesting!
GEC | Stretchable Graphical Borders
You can see a gallery of graphical borders here.
November 09, 2002 | Permalink | Comments (1) | TrackBack (0)
Scrollbar Coloring & Drop Caps CSS
CSS Snippets
A couple of CSS "how-to" guides:
November 08, 2002 | Permalink | Comments (0) | TrackBack (0)
The Owen Hack: Hiding CSS from Opera
CSS Snippets
Albin.Net CSS: Owen Hack is a method of hiding CSS from Opera, as a way of increasing viewability in that browser. There is also a link on that page to the "Be Mean to Opera" Hack, which hides CSS from Opera 3-5.
November 07, 2002 | Permalink | Comments (0) | TrackBack (0)
CSS Rounded Corners
CSS Snippets
Albin.Net CSS: Bullet-Proof Rounded Corners. I'm not sure I'm ready to tackle this yet. But it's good to know there's a good CSS option for this out there!
November 05, 2002 | Permalink | Comments (0) | TrackBack (0)
Two styles of links on one page
CSS Snippets
I have found that I often want to have two styles of links on my blog page - one for the body of the entry (underlined usually) and another for the posted line.
The default MT templates now have underline as the default link style, which I understand is great for visual identification of links. If you'd rather not have your posted line underlined though, for example (as is my preference usually) you can make another class of links in your style sheet.
I like to call my class "noline" (helps me remember!). An example of the CSS that would go into the style sheet follows. Once added to the style sheet, you'll have to find the <a href> tags in your templates that you don't want a line under and add class = "noline" to each one. It should look something like this: <a href="<$MTEntryLink$>#<$MTEntryID pad="1"$>" class="noline"><$MTEntryDate format="%x"$></a>
Continue reading "Two styles of links on one page"
November 04, 2002 | Permalink | Comments (0) | TrackBack (0)
Text Sizing
CSS Snippets
This is an excellent site to show the various options for setting text size in CSS - with lots of visual examples. It doesn't reach any definitive conclusions, but lots of food for thought.
November 03, 2002 | Permalink | Comments (0) | TrackBack (0)
Putting Two Items on same line
CSS Snippets
This is the code I use to put the entry title and the category on the same line. It could also be used to put the title and the date on the same line just by switching out the appropriate MT tags. This example has the most of the css inline.
Continue reading "Putting Two Items on same line"
November 01, 2002 | Permalink | Comments (0) | TrackBack (0)
IE Stylesheet Browser
CSS Snippets
One of my favourite little programs is IE Stylesheet Browser. Once installed, it adds a right-click option to Internet Explorer to "View stylesheets" for any web page you are viewing. I have found this very handy for those "how did they do that?" kind of questions. It's a great way to learn CSS by seeing the look of the finished page and seeing the CSS that produced it.
November 01, 2002 | Permalink | Comments (0) | TrackBack (0)
Floats and clearing divs
CSS Snippets
When using float for CSS elements, they no longer take up any defined space on the page. This can cause problems with subsquent elements not knowing where to place themselves, resulting in overlapping elements. Placing this tag after the floated element, should clear the problem.
<div style="clear:both"></div>
October 28, 2002 | Permalink | Comments (1) | TrackBack (0)
IE6 CSS Bug: Dotted Borders
CSS Snippets
Internet Explorer 6 has a CSS bug that is very annoying. When a 1px dotted border is specified, it is displayed as a dashed border instead.
The fix? Specify a 2px (or greater) border width and it will display as dotted. It's not quite the same but it's close ... if you absolutely demand dots :)
October 27, 2002 | Permalink | Comments (1) | TrackBack (0)
