In This Issue...

The CSS Anthology: 101 Essential Tips, Tricks & Hacks

by Rachel Andrew

"Cascading Style Sheets sound intimidating. In reality, however, CSS is one of the most convenient tools available to Web developers."

101 essential CSS solutions for Web design problems.

Download the free chapters now!

Introduction

I like to think I'm on top of things when it comes to the Web, but every once in awhile something sneaks up behind me and yells "Boo!" Last week, the headaches surrounding XHTML offered one such painful discovery.

In case you're even less in step with this stuff than me, XHTML 1.0 is a language for writing Web pages using the same tags as HTML, but with the more tightly controlled tag syntax of XML. XHTML makes it easier for programs of all kinds to read and generate Web pages, while making the job of the Web developer only slightly harder.

XHTML also allows for other XML-based tag languages to be mixed into a Web page for specialized needs (e.g. MathML). Browsers that support these tag languages can then display such specialized content within the page. This extensibility puts the 'X' in XHTML.

The case for avoiding XHTML was pointed out to me by the author of SitePoint's upcoming DHTML book, as I tut-tutted his use of HTML (as opposed to XHTML) for the book's sample code.

Here it is in a nutshell:

1. Browsers decide how to handle a file based on the MIME type that the server sends with it.
2. HTML Web pages are identified with a MIME type of text/html.
3. Pages written in XHTML that are sent with a MIME type of text/html don't benefit from any of the features of XHTML.
4. To benefit from the features of XHTML, pages must be sent as application/xhtml+xml.
5. The most popular Web browser (Internet Explorer 6) cannot view pages sent as application/xhtml+xml.

From this, it follows that you cannot benefit from using XHTML without breaking compatibility with Internet Explorer 6. So you might as well just use HTML.

With this in mind, the case for using XHTML is a lot weaker than I had come to believe. What it comes down to is "Web standards are good, so to help promote them, support XHTML by implementing it however you can. Your clients all want it anyway."

What most standards-conscious professional developers do today is write XHTML and allow browsers to treat it as HTML. Meanwhile, advanced developers who want to take advantage of XHTML can configure their servers to send XHTML pages as application/xhtml+xml to browsers that support it (not Internet Explorer).

Assuming that isn't practical for you, you're left with a choice: support the XHTML standard by feeding it to browsers that expect HTML, or stick with HTML and send browsers what they expect to receive.

Personally, I'm on the fence. I'll continue to use XHTML in my own projects, and even configure my servers to send application/xhtml+xml where appropriate, but SitePoint's DHTML book will be published with HTML.

Internet Explorer 7 Announced

Microsoft stirred up developers across the Web yesterday by announcing that it would release Internet Explorer 7 for Windows XP, with beta versions becoming available by the middle of this year. A close look at the announcement, however, suggests little or no work will be done on the rendering engine, the bane of Web designers everywhere.

Solid information about just what will be in IE7 is hard to come by. My gut feeling is that the people who will be building IE7 got the news around the same time we did, and they're still scrambling to define just what they can do in the time available.

The one thing we can be sure of at this stage is that Microsoft will market IE7 as a more secure browser, in the same vein as the Windows XP SP2 update. The intention seems to be to stem the flow of users to alternatives like Mozilla Firefox.

The question on the minds of Web designers everywhere: will Microsoft sneak in any improvements to the way the browser displays Web pages at the same time? At this stage, there is nothing to suggest they will, but we can always hope!

Read the blog entry:

DHTML & CSS Blog: Stylish Scripting by Simon Willison Internet Explorer 7 (21 comments)

One-Line Menus

HTML forms are far from ideal, but they've been getting the job done for a decade with only minor changes. One idiosynchrasy that has always bugged me is that there's no obvious way to make the <select> tag produce a menu of size 1 without it turning into a drop-down list.

Most of the time, it makes plenty of sense for the browser to collapse a <select size="1"> into a drop-down list. But every once in awhile, it's a pain.

Sometimes what I want is a menu that is just tall enough to contain the number of menu items it contains. If it contains three items, I give it size="3". If it contains ten, size="10". But when it contains one item and I assign size="1", the browser turns it into a drop-down list with one item in it -- wrecking the look and feel of my form.

If you really want to force the browser to display a menu one item tall, just set the multiple attribute:

<select name="menu" size="1"
multiple="multiple">
  <option>Menu option</option>
</select>

This has the minor side-effect of allowing the user to deselect the option once they have selected it (something they can't do with normal menus), but in most cases that's not a big deal.

Of course, if you're setting the size of the menu for presentational reasons, you should be using CSS to do the job.

That's all for this issue -- thanks for reading! I'll see you in two weeks.

Kevin Yank
techtimes@sitepoint.com
Editor, The SitePoint Tech Times

Help Your Friends Out

• Do you put your content first in the code for an accessible website?
  in Accessibility and Usability
  
  
• All my titles are images - Can I make a hidden <h1>?
  in Search Engine Optimization
  
  
• Moving from Tables to CSS
  in CSS
  
  
• Causes of High Server Load
  in PHP
  
  
• CSS for form layout
  in CSS
  
  

Open Source Blog:
Open Sourcery

• Measure System Security
  1 comments
  
  
• Change the Default Password Please
  7 comments
  
  
• PostgreSQL 8.01 on Mac OS X
  1 comments
  
  
• Build Your Own RPMs
  
  
• Alien Package Converter for Linux
  2 comments
  
  

PHP Blog:
Dynamically Typed

• What's keeping you from PHP5?
  45 comments
  
  

Java/J2EE Blog:
The Daily Grind

• Java 5 launched with java.com redesign
  6 comments
  
  
• Of Java and Gin
  4 comments