CSS Wizardry posts tagged ‘HTML’


Building sites without using IDs or classes

This morning, for one reason or another, I decided to have a go at coding up a page without using any IDs or classes in my markup, and therefore none in my CSS. I’m not sure why I tried it, I guess I just did… In order to make it a fairly painless job I dove straight into the browser and coded up a simple header, footer, two column layout. View the demo and be sure to view the source.

(more…)


Multiple column lists using one <ul>

This is a quick, simple tutorial on how to create multiple column lists by only using one ul. Often is the case when you’d want multiple lists side-by-side, but you end up using markup like <ul class="col"> in order to get several lists sat next to each other. However, by simply floating lis left and setting their width to the correct percentage (two columns = li{width:50%;} and so on), you can attain a multiple column list pretty easily.

View demo

(more…)


A reconsideration—in defence of <b> and <i> (or: people fear what they don’t understand)

The other day, I got to thinking about the HTML elements <b> and <i>, and wondered if they were still viably usable in production code. I’ve personally never used them before but I was aware that they existed and were still very much valid XHTML markup (even in the Strict DOCTYPE!). Wondering whether I’d avoided two elements for three years unnecessarily, I did some digging.

What the facts state

<b> and <i> are still valid, and as XHTML is just an XML serialisation of HTML, pretty much all the elements apparent in the HTML spec are true of the XHTML spec too—it is, pretty much, just the way in which these elements are written that makes them different in XHTML.

Twitter

With the help of @smashingmag I turned to Twitter and my knowledgeable followers and asked the question:

“Using <i> and <b> in (valid) XHTML (strict)… your thoughts on this would be much appreciated. #upcomingBlogPost Cheers all!” @csswizardry

(more…)


Typographic work planner

No one likes being told what to do, especially if it’s work related, but nevertheless jobs need done. Why present boring stuff in a boring way? If you’re going to be told what to do, at least soften the blow by being told nicely. Enter this, a little HTML/CSS typographic work planner. By using some super-semantic HTML and a dash of CSS you can craft a beautiful looking yet incredibly simple work planner for you and your staff.

Screenshot of the typographic work planner

(more…)


Search CSS Wizardry

Archives

Categories

Twitter—2089 followers

You should follow me.

Subscribe—RSS