Re: [css-d] float problem: not being contained or something else?
Good morning Gunlaug, It was foretold that on 24/10/2008 @ 06:35:22 GMT+0200 (which was 02:35:22 where I live) Gunlaug Sørtun would write: snipped a bit Delete 'width: 18em' on #puller2 and let that float default to 'width: auto' and shrink-wrap. Delete 'margin-left: 1em' while you're at it. That will give you the most stable line-up, at the right edge of #main-top. When trying to correct it myself yesterday, i indeed used the 'width:auto' but ofcourse forgot about the margin-left. Works like a charm!! I also have a float drop in IE: resizing drops the whole content beneath the nav. Have i messed up my math somewhere? Think so :-) It is the percentage (not 100%) that makes it a little harder to calculate trigger-points. A quick test gives me these values for near-flawless operation on 96dpi resolution screens... * html #container{ width:expression( (document.documentElement.offsetWidth) (830/12) * parseInt(document.body.currentStyle.fontSize)? 48.75em : ((document.documentElement.offsetWidth) (600/12) * parseInt(document.body.currentStyle.fontSize)? 34.75em : 96%)); } I raised min-width to 34.75em because IE6 has a tendency to drop content too early on narrow windows. Darn, i recalculated all my widths yesterday except for the expression. Never thought that would be culprit. On the hand it's the first time i used that technique so i hope i'll be forgiven ;-) Guess i need to read your excellent article again :-) That expression do not work well on other screen-resolutions than 96dpi - the most widespread one that IE6 may be found on at the moment, and there's not much I can do about that since resolution can't be easily checked and used as a variable in expressions. Oh well, for me it suffices ... i guess if we want to consider all possible screen resolutions out there and users that change default font size etc we'll be in the magic business :-) -- Best regards, Luc _ Using the best e-mail client: The Bat! version 4.0.18 with Windows XP (build 2600), version 5.1 Service Pack 2 and using the best browser: Opera. Doctors automatically know what's wrong with you. They have a sick sense. - Beau M., age 10. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] float problem: not being contained or something else?
Luc wrote: That expression do not work well on other screen-resolutions than 96dpi - the most widespread one that IE6 may be found on at the moment, and there's not much I can do about that since resolution can't be easily checked and used as a variable in expressions. Oh well, for me it suffices ... i guess if we want to consider all possible screen resolutions out there and users that change default font size etc we'll be in the magic business :-) You're right: web design isn't magic - just code :-) FWIW: my expression takes height for font resizing. That's the whole idea behind extracting the browser's own font-size and using it to calculate dimensional trigger-points. And, yes, ideally we should take all those variants and options at the user-end into account while designing. Someone may actually use them. Pity those who create hardware and software don't always agree on how to make all those variants and options interact, as that would have made it much easier for us. As more and more browsers come around to support mediaqueries, we can start doing something useful for end-users with other set-ups and preferences than our own. Still need some leveling on the hardware and software front for it to work consistently though. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] float problem: not being contained or something else?
Good afternoon Gunlaug, It was foretold that on 24/10/2008 @ 17:18:28 GMT+0200 (which was 13:18:28 where I live) Gunlaug Sørtun would write: You're right: web design isn't magic - just code :-) Yup and code is already difficult enough for me, let alone magic ;-) FWIW: my expression takes height for font resizing. That's the whole idea behind extracting the browser's own font-size and using it to calculate dimensional trigger-points. I see ... it starts to fall into place now! And, yes, ideally we should take all those variants and options at the user-end into account while designing. Someone may actually use them. Pity those who create hardware and software don't always agree on how to make all those variants and options interact, as that would have made it much easier for us. As more and more browsers come around to support mediaqueries, we can start doing something useful for end-users with other set-ups and preferences than our own. Still need some leveling on the hardware and software front for it to work consistently though. Couldn't agree more. -- Best regards, Luc _ Using the best e-mail client: The Bat! version 4.0.18 with Windows XP (build 2600), version 5.1 Service Pack 2 and using the best browser: Opera. A democracy is a government in the hands of men of low birth, no property, and vulgar employments. - Aristotle, Rhetoric, Independency. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] float problem: not being contained or something else?
Luc wrote: http://www.dzinelabs.com/sandbox/ieexpresssion.html When resizing your browser, and also on resizing the font, all the headings shift way over. At first i thought it was a containing float problem but if i'm correct that only effects escaping floats vertically. Those headings are contained in #main-top, which has a 'width: 36em' declared on it. This means it'll have a certain width, and that width will change with font-resizing but _not_ with window-resizing. By simply changing that to... #main-top {width: 100%;} ...and deleting the left paddings on h1 and h2, the line-up will adjust to window-size with the rest of the page, and won't be affected by font-resizing. regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] float problem: not being contained or something else?
Hello Gunlaug, It was foretold that on 23/10/2008 @ 01:26:02 GMT+0200 (which was 21:26:02 where I live) Gunlaug Sørtun would write: snipped a bit Those headings are contained in #main-top, which has a 'width: 36em' declared on it. This means it'll have a certain width, and that width will change with font-resizing but _not_ with window-resizing. By simply changing that to... #main-top {width: 100%;} ...and deleting the left paddings on h1 and h2, the line-up will adjust to window-size with the rest of the page, and won't be affected by font-resizing. That's indeed simple lol. Your solution works for the main-top but i tried the same for the nested puller2 div but i had no luck. That one still gives me the same problem. I also have a float drop in IE: resizing drops the whole content beneath the nav. Have i messed up my math somewhere? http://www.dzinelabs.com/sandbox/ieexpresssion.html -- Best regards, Luc _ Using the best e-mail client: The Bat! version 4.0.18 with Windows XP (build 2600), version 5.1 Service Pack 2 and using the best browser: Opera. To bookmark this homepage or not to bookmark, that is the question. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] float problem: not being contained or something else?
Luc wrote: Hello Gunlaug, It was foretold that on 23/10/2008 @ 01:26:02 GMT+0200 (which was 21:26:02 where I live) Gunlaug Sørtun would write: snipped a bit Those headings are contained in #main-top, which has a 'width: 36em' declared on it. This means it'll have a certain width, and that width will change with font-resizing but _not_ with window-resizing. By simply changing that to... #main-top {width: 100%;} ...and deleting the left paddings on h1 and h2, the line-up will adjust to window-size with the rest of the page, and won't be affected by font-resizing. That's indeed simple lol. Your solution works for the main-top but i tried the same for the nested puller2 div but i had no luck. That one still gives me the same problem. Delete 'width: 18em' on #puller2 and let that float default to 'width: auto' and shrink-wrap. Delete 'margin-left: 1em' while you're at it. That will give you the most stable line-up, at the right edge of #main-top. I also have a float drop in IE: resizing drops the whole content beneath the nav. Have i messed up my math somewhere? Think so :-) It is the percentage (not 100%) that makes it a little harder to calculate trigger-points. I usually just test and tweak until it is close enough for comfort. A quick test gives me these values for near-flawless operation on 96dpi resolution screens... * html #container{ width:expression( (document.documentElement.offsetWidth) (830/12) * parseInt(document.body.currentStyle.fontSize)? 48.75em : ((document.documentElement.offsetWidth) (600/12) * parseInt(document.body.currentStyle.fontSize)? 34.75em : 96%)); } I raised min-width to 34.75em because IE6 has a tendency to drop content too early on narrow windows. That expression do not work well on other screen-resolutions than 96dpi - the most widespread one that IE6 may be found on at the moment, and there's not much I can do about that since resolution can't be easily checked and used as a variable in expressions. http://www.dzinelabs.com/sandbox/ieexpresssion.html regards Georg -- http://www.gunlaug.no __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/