November 06, 2001

Yay! This page now links

Yay! This page now links to one main stylesheet, and then additionally to one of two possible stylesheets containing the positioning information, depending on which browser it detects. This is an improvement over my previous templating method that required two versions of the page. Two tiny stylesheets are all that'll be required for all the pages in the site now, and they'll all remain table-free!

Note: all the other pages in the site are temporarily screwed up.

The differences between the two browser-specific stylesheets are slight. I don't fully understand where the faults lie, so I'm putting them here for further analysis. Here's the IE one (also served to Netscape, interestingly), tested on IE5.5 Win, NN4.7 Win:

#box {
  margin: 123px 2% 0 180px;
  width: 100%;
  padding: 30px;
  border: 1px #ffc solid;
  background-color: #cc9;
  text-align: left;
}
#content {
  float: left;
  width: 75%;
}
#sidebar {
  float: right;
  width: 25%;
  padding-left: 30px;
}

And here's the "Other" one, tested on Opera5.1.2 Win:

#box {
  margin: 123px 2% 0 180px;
  padding: 30px;
  border: 1px #ffc solid;
  background-color: #cc9;
  text-align: left;
}
#content {
  float: left;
  width: 70%;
}
#sidebar {
  float: right;
  width: 25%;
}

A request to anyone reading this: Please check this page (not yet the rest of the site) on all browsers and platforms you have available. Be sure to resize the page. If anything buggy appears to happen, please let me know, stating which browser, version, and platform it occurred on. If you also include a screenshot, that'll be much appreciated.

I shudder to think how long all this testing would've taken if I'd have had to upload to uklinux in order for the PHP to execute. Testing was done locally, served on Apache with PHP installed.

Posted by francois at November 06, 2001 12:00 PM

Comments

Post a comment

(HTML is OK. Two linebreaks are converted to a <p>, one linebreak to a <br />. Represent all occurrences of <, >, and & by character or entity references, i.e. &lt;, &gt;, and &amp;.)

Name:


Email Address:


URL:


Comments:


Remember info?