Log In...
As all my avid readers will be aware (hi Dave, Steve, Chris and Jo), I like using ems to layout websites so they stay nice and elastic. It works great in Firefox, Safari, etc. but not quite nicely enough in Explorer (surprise surprise). So I did a quick google and found this little nugget:
body { font-size: 80% }
That's it. No more ridiculously small fonts when 'smallest' text size is selected (well it's still a bit small, but you can actually read it now) and layouts work much better. Down with pixels!
Zaonce...
This Planet is a Tedious Place...
27/04/08 Elastic-tastic...
posted by Gruntfuggly # 22:21 4 comments
12/04/08 A different point of view
My kids had come into our bedroom and we had long conversation after one of them claimed to be able to see Mt. Everest out of the bedroom window. I was trying to get them to imagine how big Everest really would be - 20 times higher than the Malvern hills we were actually looking at (pretty impossible to imagine actually).
One thing led to another - tectonic plates pushing together to create mountain ranges ... oceanic trenches ... fossils at the tops of mountains ... why it is easier to explore mountains than the sea because of the pressure ... ears popping, etc.
Next thing, my other daughter zips off to tell her grandmother that we've got some blue tits nesting in a box in our garden. I then hear her say that this is amazing because it had only happened because she was born. Because, then she had a birthday so she was given the nest box so the birds had somewhere to make a nest and have babies.
Looks like humans can't help seeing things from their own perspective...
One thing led to another - tectonic plates pushing together to create mountain ranges ... oceanic trenches ... fossils at the tops of mountains ... why it is easier to explore mountains than the sea because of the pressure ... ears popping, etc.
Next thing, my other daughter zips off to tell her grandmother that we've got some blue tits nesting in a box in our garden. I then hear her say that this is amazing because it had only happened because she was born. Because, then she had a birthday so she was given the nest box so the birds had somewhere to make a nest and have babies.
Looks like humans can't help seeing things from their own perspective...
posted by Gruntfuggly # 12:01 5 comments
No point asking why that works, but...
I have 'small' as my body font-size. Would that have the same effect or does it have to be a percentage? And does it have to be 80%?
My latest CSS issue is with printing tables. I don't want page breaks in the middle of a table row, so have used:
td { page-break-inside: avoid }
This works well in Firefox (it even replicates the table headings on each new page), but doesn't seem to be supported in IE or Safari. Do you know any tricks for solving this one? So far, my only solution would be to generate the printed version using PDFWriter or similar, but that's a lot more work.
Chris # 28/04/08 07:22
Using 'small' (or medium or large) has the expected effect on the fonts (small makes it all go tiny) but doesn't seem to fix the spacing issues.
Other percentages seem to work as expected, but 80% seems to give a good range from smallest to largest. It's smaller than the default (when set to medium) though.
I think you stuck with your page breaks. When I looked I found fair few people with the same problem but no solutions.
Any chance of using a non-table solution?
Gruntfuggly # 28/04/08 10:05
Even if I didn't use a table, I would still want to prevent page breaks in the middle of certain elements.
The other printing nasty is trying to control print page orientation. Again, this can is specified in CSS like...
@page land { size: landscape }
But no browsers (except Opera?) seem to support this either.
If I change my body.font-size to 80%, I get pixel sizing problems in Safari that I didn't have before! I'll look into this (could be I've got some other font-sizes defined that are interacting).
Chris # 28/04/08 10:29
From what I read, I think page breaks might work reasonably well in other elements - it just seems to be recommended not to use them in tables.
Opera does indeed seem to offer the best support from printing pages.
Hmmm - yes, Safari does do something a little bit different - if you make it 100%, it seems to be the same as not specifying the size (no surprise there), and still improves Explorer. Maybe 100% is the way to go...
Gruntfuggly # 28/04/08 14:27
Somebody # 19/01/25 05:55
Add Comment