Re: [css-d] centering block elements in IE 6.0 fails
Hello, almost two years ago I had trouble horizontally centering an absolutely positioned element: On Tuesday 24 October 2006, Gunlaug Sørtun wrote: Daniel Kabs wrote: Please see the test page at http://www.mobotixserver.de/~daniel/css_center_horizontally.html The page works on Firefox and Konqueror but not on IE 6.0 (SP2). ... IE6 can *not* relate A:P elements to opposite sides of parent-container, so only one of these properties is used... left: 0; right: 0; ...not both. IE ends up positioning '.center' according to 'left: 0;' and ignores 'right: 0;'. Result: the auto-margins becomes useless in that browser. I found a workaround by setting the element to relative positioning and wrapping it with an absolutely positioned element instead. This now works on IE 6 and 7, too. I updated the test page and the css wiki page accordingly. Cheers Daniel __ 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/
[css-d] Firefox: image overflows table
Hello, usually tables stretch to fit their content. Not in this case: http://14mb.de/u/dkabs/ff_table_padding.html The page contains a table with two cells: Left cell has only text, right cell has an image. That cell is aligned to the right and has the style white-space set to nowrap. When rendered with Firefox (2.0.0.14 here), part of the image overflows the table cell and is displayed outside the table. To see this, shrink the window until the text wraps. If either alignment or the white-space style is removed, the table returns to standard behaviour, i.e. the image is completely inside the table. Does anybody know why this is? Cheers Daniel __ 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] overflow:auto and weird scrollbar behavior
Hello!
thanks for your suggestions.
On Thursday 28 February 2008, parameswaran marimuthu wrote:
#content {
display:inline;
}
When I set the #content DIV to display:inline, setting its height does no
longer change the height of the DIV. Sorry, this did not work.
Cheers
Daniel
__
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/
[css-d] overflow:auto and weird scrollbar behavior
Hi there, Internet Explorer (6 and 7) confounds me with inconsistent scrollbar behavior. I use three DIVs for creating a three row layout - header DIV - content DIV - footer DIV The second DIV has overflow set to auto. I'm seeking a fluid layout. That is the header should glue at the browser window top and the footer at the bottom - no matter how much content is in the second DIV. I failed to get a fluid layout applying CSS only, so I asked Javascript for help: I use Javascript to adapt the second DIV's CSS height so that all three DIVs fit in the browser window. Usually scrollbars appear on the second DIV. However, if the user increases the browser window width (until content fits) the x-scrollbar is unnecessary and thus should disappear. Instead, depending on the browser window width at the time the document was loaded the x-scrollbar stays. The problem is best explained using an example. So please see this stripped down version of the original page where I first encountered the problem: http://14mb.de/u/dkabs/testcase_ie_resize.html The page contains three DIVs: header, content (yellow background), and footer DIV (and an advert, but I did not place it). The Javascript code has been replaced by a form button that sets CSS height of content DIV to 200px. The form buttons also simulates a fixed width content in order to force a horizontal scrollbar to appear if the browser window is made small enough. Try this: - load page in a small browser window - press button on page - x- and y-scrollbars on content DIV appear - increase browser window width [*]- x-scrollbar stays (unexpected) - reload page (this time the browser window is wide) - press button on page - y-scrollbar, but no x-scrollbar - shrink page width - x-scrollbar appears (as expected) - expand page width - x-scrollbar disappears (as expected) [*]Strangely enough, if the browser window is maximized using Maximize window button, the x-scrollbar duly disappears. How can I work around this problem? I'd like to get rid of the x-scrollbar if it is not necessary and still keep the layout fluid. How can I do this? Cheers Daniel __ 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/
[css-d] CSS wiki suggestion: enable raw HTML?
Hello there, regarding the CSS wiki at http://css-discuss.incutio.com/ I understand that a lot of CSS tricks and problems are explained on external sites. They often contain elaborate descriptions regarding a certain topic and provide examples. CSS wiki collects URLs of those sites and presents them including a short description. On the other hand, the CSS wiki itself contains CSS code explaining how something should be done but it fails to give examples. All examples are hosted on external sites. How about enabling raw HTML for this Tavi WIKI installation so one can add examples inside wiki pages? Cheers Daniel PS: I added this suggestion to http://css-discuss.incutio.com/?page=WikiSuggestions __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] centering block elements in IE 6.0 fails
On Tuesday 24 October 2006 14:24, Gunlaug Sørtun wrote: Yes, IE6 centers block-element by auto-margins when in standard compliant mode, but there's a flaw in IE when it is served absolute positioned elements. As I wrote before, I read about the Centering with auto-margins technique in Eric Meyer's book CSS The definitive Guide. Applying this technique for centering horizontally, Eric gives an example where an outer DIV with relative positioning wraps an inner one with absolute positioning. Two pages on, Eric gives a similar example for vertically centering, but this time he states that no version of IE supported the vertical-centering behavior ..., i.e. explicitly limiting the flaw to vertically centering. So I was in doubt about whether I did something wrong. Thanks for acknowledging that IE is the flaw :-) Result: the auto-margins becomes useless in that browser. Any workarounds available? I used absolute positioning to take the element out of the normal page flow and display it on top of other text (with opacity applied). I reckon, floated elements can not be used instead. Cheers Daniel __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] centering block elements in IE 6.0 fails
Hello there, I've read in Eric Meyer's book that one can center nested block elements *horizontally* inside a parent block element by setting left and right margins of the nested element to auto (p. 316, 2nd. ed.). I also found postings in this list saying so. I take it, this should work in IE 6.0 as long as it is in standards-compliant mode: http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp I tried to apply the Centering with auto-margins technique according to http://css-discuss.incutio.com/?page=CenteringBlockElement Please see the test page at http://www.mobotixserver.de/~daniel/css_center_horizontally.html The page works on Firefox and Konqueror but not on IE 6.0 (SP2). Did I do something wrong or why is IE failing once more? Cheers Daniel Kabs __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
