CSS Calendar Layout (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets



Message

rdouglass -> CSS Calendar Layout (4/12/2006 11:19:13)

OK. So, inspired by another thread, I'm taking it upon myself to write a CSS freindly calendar. I have put together a start and am in need of some CSS critics (Ah! got some attentions. [;)])

I have a very beginning start here:

http://www.clarkinsurance.com/rd/

and this is strictly for layout purposes.

What I essentially started with was a nested <div> setup like this:

<div style="position:absolute;width:600px;top:0px;"><!-- begin row div-->
<div class="nestedCell"><!-- begin Sun div-->
Sun
<div class="nestedCell"><!-- begin Mon div-->
Mon
<div class="nestedCell"><!-- begin Tue div-->
Tue
<div class="nestedCell"><!-- begin Wed div-->
Wed
<div class="nestedCell"><!-- begin Thu div-->
Thu
<div class="nestedCell"><!-- begin Fri div-->
Fri
<div class="nestedCell"><!-- begin Sat div-->
Sat
</div><!-- end Sat div-->
</div><!-- end Fri div-->
</div><!-- end Thu div-->
</div><!-- end Wed div-->
</div><!-- end Tue div-->
</div><!-- end Mon div-->
</div><!-- end Sun div-->
</div><!-- end row div-->


Now there seems to be a few minor issues right now between FF and IE and I'll work them out in terms of image backgrounds and such but my main Q is in terms of the layout.

Is this the best I can do? Anyone have any ideas as to how to make this layout more fluid? To me it just looks like a table (although it is not) and quite static.

The nested div's work but have some unwanted side affects; Can't comfortably use em's for font sizing for one. Anything other than 1em 'cascades' the changes from div to div.

I remember reading once regarding pseudo-classes using percentages for div widths but I cannot remember where.

Any other input regarding layouts are encouraged and appreciated. Content (and what to use for the content engine) will come later. Two of my requirements for any suggestions are **No Javascript** and **No Tables**.



jaybee -> RE: CSS Calendar Layout (4/12/2006 11:23:00)

Great start. I'll take a closer look at it later.



Tailslide -> RE: CSS Calendar Layout (4/12/2006 11:56:35)

It's not often you'll hear me say this... but I'd use a table - it would be reasonable and actually semantic to call that tabular data. My definition (or one I stole) of tabular data is where you can turn the information round on it's axis and it still makes sense.

I think the inheritance issues you'll get with so many nested divs will be real headache.

Stu Nicholls has a couple of CSS only calendars if that's of any help: http://www.cssplay.co.uk/menu/calendar2.html

Sorry that's not much help at all...



rdouglass -> RE: CSS Calendar Layout (4/12/2006 12:39:38)

quote:

Sorry that's not much help at all...


Actually it is. Thanks.



rdouglass -> RE: CSS Calendar Layout (4/12/2006 12:41:58)

quote:

but I'd use a table


Just a Q regarding this: How would that and Accessability work together. The way I'm understanding this is that accesable web sites don't like tables. Or am I reading more into this than is actually there (or maybe this Q belongs in the other forum?)



Tailslide -> RE: CSS Calendar Layout (4/12/2006 13:01:25)

There's nothing wrong with using tables as long as they're used properly - i.e. not for layout purposes.

For tabular data they are the correct way of presenting the info - you can make tables more accessible by adding various little extras - this is a good explanation of the different techniques (there are a couple) : http://www.jimthatcher.com/webcourse9.htm

BTW - there are those in the "semantic" web movement who will argue to the death about the correct usage of various bits of markup such as tables and definition lists. I've seen arguments either way regarding calendars - but in my mind, the tester is as mentioned previously - turning the data around and see if it still makes sense - if it does then it's probably tabular and should be in a table.



rubyaim -> RE: CSS Calendar Layout (4/12/2006 19:04:55)

I like the way you have done the calendar [:)]

Here is another link on Accessible Tables
http://www.usability.com.au/resources/tables.cfm

Am in the middle of re-building our main intranet from table layout to css but am still using tables for anything that I consider tabular data.

I found setting up accessible tables quite painful and very tedious at first as I'd never used summary, caption, footer, id etc previously. It's not so bad now that I've a few created that I reuse as needed.



Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.09375