Left Justified
FeedsA CSS Presentation? Me?
∞ | February 8, 2005 | Category: Cascading Style
Lea and Gary are going to kill me for leaving it this late, but here goes…
Wednesday, 9th of February (tomorrow!!!), I’m giving a presentation to the Brisbane Web Standards Group entitled ‘Site in an Hour — Making Complex CSS Layouts’.
If you’re in the area, why don’t you come along? I’d really like to make it more of a group discussion/brain storm than just myself standing at the front of the room blathering on like a nerd.
If you do intend on coming, RSVP NOW, while you still can.
For those interested but unable to attend, the S5 presentation and the example site will be online by the end of the week.
Have Your Say
Sorry, comments are closed on this post.
I wish I was there. Maybe next time. All the best Andrew and everybody up there
in sunny Queensland 
. Look forward to the s5 presentation.
Can anyone buy me a plane ticket, although I’ll have to leave shortly, it’s a long way from Scotland
Anyhow, I await it coming online
Hope it goes well.
Hi,
why not ;o)
a bit late maybe … Brittanny is a bit far to ;o)
Do you have stuff about this in documents online ?
Yes, yes I do…
I’m still waiting to clear up a minor js bug whereby a script I’ve used many times before no longer works under XPsp2 when served from the web, but works locally.
A proper write-up will be along shortly, in the mean time, here’s the presentation.
I’ve got to look at the code of how you’ve put that online now…
Hi man,
god bless you for these slides
Love to read thru the materials, it’s a pitty I can’t attend similar meetings. (Although the ticket-buying idea wasn’t bad 
…)
Hey Geoffrey, I don’t know if you’ve already discovered it, but that’s Eric Meyer’s S5.
Thanks Andrew
Would love to attend, but since im in the UK and havent been to Brisbane since December 03, i’ll unfortunately have to miss on this one.
Perhaps you will be doing something over this side sometime ?
You mean in the UK? Hell, that’d be nice…
*Starts begging to Andrew*
Uk? Me? Maybe when it stops raining
hehe
Come in our summer (your winter), then it will be raining in scotland, and it might be in England :p Stupid British whether…
In other news, I’m coming to Australia either this year or next year.
Stops Raining? Thats a novel idea.
Hey, so what about CZ?
We have sunny summers here 
And lo, it was good. Viva.
Extremely well done!
I must say out how excited I am that you pointed out the minmax.js script - it contains the exact functionality I’ve been seeking for IE.
An unfortunate little side effect of the script when loading the site in IE is that it takes about 2 seconds on my high speed connection for the container to actually adjust its width. In the grand scheme of things, however, this is a great solution for a problem that has been haunting me in my work for quite some time.
Thanks Again!
i’m just wondering what you did to achieve the woodgrain for the site. i LOVE it! could you give an online tut or point us to the tut you got it from?
:o)
A nice presentation in S5! Don’t forget to pop a word over to Eric to show him what you’ve done. It’s a good simple theme
Relapse, Scott: Thanks!
Nick:The woodgrain was done using overlay effects, dodging, buring and history brush alterations in photoshop. I’ve got a few photoshop related posts floating around in my head; unfortunately I’m swamped with work and that must take priority
David:That template is merely a quick alteration of one of the standard templates, I may give Eric some feedback though…
#left, #center, #right ???
Use class with semantics in mind.
Aldemir: To quote one of the comments in the demo site’s CSS file:
I broke the rules for the sake of simplicity, though I did point out this fact to the audience and have also noted it in the CSS for those at home
:)
Andrew, never do anything for simplicity
Did you happen to notice that in mozilla browsers your test site as well as others that you have done don’t put up a horiz scroll bar when the resolution is less than 800X600 or when the font size it pushed up 2 notches at 800X600???
perhaps in your container you could turn on an overflow:auto or something to compensate for that.
The teacher at the web design class I attend[1] assigned us to build (copy) this design using whatever tool we wish. Demonstrating the min-max effect in IE6, the browser locked up on her.
This happens too on my own Win XP laptop, where I have been playing with using “overflow:hidden” instead of “content:’.'” for float clearing (it works, but you need to add widths to some).
I also notice that the min-max effect does not work in IE 5.01.
Another side effect of the min-max script seems to add padding to the nav and the “subscribe” form that is not present on other browsers. I switched off scripting in IE and the extra padding went away.
This was a very informative exercise. Thank you so much.
[1] Robins Blog
I think, Generico is definitely one of the best 3-column layouts, and the one I’m going to steal for myself.
Good things about this layout:
- contents first.
- semi liquid columns with forced minimal width.
- neihter columns nor text overlap when resizing or zooming thanks to using ems and %.
- relatively simple and clean css with the exception of a small javascript to fix IE.
- menu bar for free
- care for small details beyond layout (forms, fonts, margins, etc.)
It’s incredible how badly other designs handle screen / font resizing and I was really impressed to see your layout keeping up the form, however I tried to squeeze the viewport or blow up the font.
The only problem was the IE bug that happens when the horizontal scroll bar appears, but somebody already mentioned it.
So, here’s the question. How much of your layout is it OK to steal? Could you give us a page and css template to work on?
Thanks!
Tom: Go crazy – it’s there for the taking, but please refrain from using any of the images. Those either belong to me or I received express permission to use them for educational purposes. They are not public domain, but the CSS is
This has been a good lesson for me – from now on I will add a CC license to all my examples so that this sort of thing is more clear. Glad you noticed the little details, especially the content first bit
Thanks for putting the CSS in the public domain. I’ve been struggling with a three column layout and being able to see how you put yours together is very helpful.
Please,
Where is the CSS for the three column layout. How can I get it?
Has anyone benen able to obtain the CSS? I’ve Googled like crazy to no avail.
The question was asked previously, but not answered: Where can we download the CSS?
Oops, sorry for not noticing those comments – they got caught up in the approx 100 spam comments this site is fortunate enough to receive per day
CSS – http://leftjusitifed.net/site-in-an-hour/site/default.css