Hi,
I'm using the planner and the iscal layout. I'm building a scheduler kind of like "Google Calendar" (at least that is how it started in my head, it is just missing a few features right now...) so I have a lot of events per day. I have a few questions about the layout, I'm still learning about CSS, so these may be more css like questions that are not 100% specific to scal.
1) How do I eliminate the scrollboxes if the name of an event in a daybox is too long to fit? I want to truncat the name and show "..." instead and have a tooltip with the full event text if it doesn't fit.
2) I increased the size of the ".daybox" and ".dayboxname", but this causes a different number of days per week to be displayed! Also, if I just use my browser to change the font size on the screen, the # of days per week changes (3 days per week, or 9.) How could I modify the layout so that there are always 7 dayboxes in a horizontal row no matter what the font size is?
3) I see a lot of Pixel width specifications in the .css styles. Could we improve the .css to not have any fixed pixel widths in the layout? Some of the elements widths seem to be calculations based on other widths specified in the CSS, this seems to make the layout fragile, hard to customize and break when the browser specifies font changes. I don't want to be overly critical as I am learning about CSS myself right now. If someone has some suggestions on how to improve the layout I would gladly do the legwork and submit my work to the project to help everyone out.
Thanks.
css, tables, and scal skins
1) Scrolling is controlled through the css overflow property. By default, we use auto to pop in the scrollbars. To truncate, change this to 'hide'.
2) Yep, if you change the daybox sizes you need to change the size of the main css class for the style. Otherwise, the wrapping goes all wonky.
3) I tried to make a less pixel-specific version but IE6 had a lot of rendering problems. So, I ended up going the "hard" way to make it work. However, Ian extended scal so that it could render using tables instead of divs. You might want to do that instead if you want a layout that will not be quite as constrained by the nature of css across browsers.
Here's the link to Ian's demo.
http://scal.fieldguidetoprogrammers.com/scal-v02-documentation/scal-tabu...
Post new comment