[css-d] decapitated picture
Well, good ol' IE6 does it again. On this page, the top left pic is chopped in half. Don't know why. HTML validates. CSS sort of does, if you don't mind the IE hacks. I know, they're everywhere, but I'm not paid to rewrite the entire site or page. Just add more stuff to the mess that's already there. Here's the site: http://www.lorettosedgwick.org/pages/aboutus.html Thanks in Advance, ;-Dave __ 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] decapitated picture
Sent: 09 April 2007 08:20 To: css-d@lists.css-discuss.org Subject: [css-d] decapitated picture Well, good ol' IE6 does it again. On this page, the top left pic is chopped in half. Don't know why. HTML validates. CSS sort of does, if you don't mind the IE hacks. I know, they're everywhere, but I'm not paid to rewrite the entire site or page. Just add more stuff to the mess that's already there. Here's the site: http://www.lorettosedgwick.org/pages/aboutus.html Thanks in Advance, ;-Dave Dave the margin-top:-3em; in the content is the culprit Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.446 / Virus Database: 269.0.0/751 - Release Date: 07/04/2007 22:57 __ 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] Popup CSS Help Please
Hi On this page I am trying to use a popup to display the lower words. http://www.lostwithiel.eu/calendar http://www.lostwithiel.eu/wp-content/themes/brownsite/style.css The relevant html is: span class=calnk nowrap=nowrapaRiver ChurchspanTime: 10:30br /br /Come and worship God/span/a/span The css attached is this: .calnk a { text-decoration: none; } .calnk a:hover { font-size: 99%; } .calnk span.link { position: relative; } .calnk span.link a span { display: none; } .calnk span.link a:hover span { color: #33; display: block; position: relative; margin-top: 10px; width: 290px; z-index: 100; } As you can see from the page that there is some reaction to what I have done but not what I expected. What I wanted was for the text to pop up but currently it is on permanent display. Any ideas how I achieve a pop-up effect please? Many thanks. -- Rich http://www.cregy.co.uk Embracing what God does for you is the best thing you can do for him. Romans 12 v 1 __ 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] What's wrong with my line-height calculations?
On Sun, 8 Apr 2007, Chris Hoffman wrote: I've been playing with overlapping text and line-height is causing me some confusion. This seems to be a rather confusing topic. p span { background-color: #ccc; /* make the lines visible */ } I used black background for body and white background for span. I think this makes the line boxes even more visible. p { font-size: 12px; line-height: 14px; } I get no gap between lines on IE 7 or Firefox 2 for most fonts. There is a gap if I use Courier, though. Using different larger values for line-height results in larger gap, instead of making the line boxes (the rectangles with the specified background color) taller. What puzzles me, from the perspective of the specifications, is that as far as I can see, line-height inherits to inner elements and should set the minimum height for them. It's intuitively (from a typographic perspective) more natural that an increased line-height value results in added leading, not in increased line box height. I guess this is what CSS specs are meant to say but they seem to say the opposite. As I understand it, the text box (inline box?) -- to which the background-color applies -- should be 12 pixels high. That seems to be how browsers generally ínterpret the situation, and probably the intended behavior. From the wording of the specs, I get a different view, but let's ignore it. The difference between that and the line-height (14 - 12 = 2 pixels) should then be divided in half, and half added to the top of the inline box and half to the bottom. Then the lines should be stacked in the paragraph. Yes, and such things normally happen. But the actual behavior seems to depend on the font family in use. For example, testing with Lucida Sans Unicode, I don't get a gap even for line-height: 16px. There's probably variation across platforms too (I'm using Windows XP), since this may relate to errors and inaccuracies in computations, and unless I'm missing something, Windows internally expresses font sizes in points, resulting in some inevitable rounding errors when other units are used to declare font-size. I'm not sure what constructive conclusions we can draw. I guess it depends on why you set line-height. -- Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/ __ 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] decapitated picture
Dave Pierce wrote: Well, good ol' IE6 does it again. On this page, the top left pic is chopped in half. Don't know why. Add 'position: relative' to the image in question, to fix IE6' stacking over the edge problems. Good for you that you don't have to fix anything else :-) http://www.lorettosedgwick.org/pages/aboutus.html regards Georg -- http://www.gunlaug.no __ 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] Web calendar
I'm pretty new to css, table-less design but I'm trying to get up to speed quickly. I had to put a calendar on the web and I tried to come up with a useful way to do it using CSS and no tables. Does anyone mind taking a look at http://www.bremenhospital.org/Clinics/0407mos.html and offering some feedback? I included the CSS in the HTML page just for simplicity's sake. Thanks. __ 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] Float/Spanning Issue
I'm working on an internal site for our company at the moment, that will eventually be opened up to the public to access our development back-ends for our server-side operations. The issue I'm having is that I am trying to get a left and right-side DIV to span the entire length of the browsers (even when collapsed under 800px), but for some reason the footer clips when collapsed. Also, I cannot get the APPex icon to float:right; correctly. Here is the comp of what it should look like eventually: http:// www.theuprock.com/html/comp.png Here is the link to what I currently have in-place: http:// www.theuprock.com/html/index4.html I am pulling my hair out at this point trying to figure the problem out, and it is not easily found via a Google search. Could someone lend me a hand and shoot me some ideas on fixing this issue? I can be reached directly at : [EMAIL PROTECTED] or by AIM: theuprock Thanks a ton. Hope to hear some feedback! Dylan M. __ 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] Weird Firefox/mozilla refreshing and jumping issue
Hello - I'm running into a strange Firefox bug which I can't figure out, and hoped a CSS guru out there could tell me what's wrong. Here are screencaps of the problem. This is running on FF 1.5-2.0 Windows: http://www.geocities.com/craiggivens01/screen.jpg http://www.geocities.com/craiggivens01/screen2.jpg That left column div (called leftColumn-home and leftColumn in the css) sometimes renders way down below the fold when Firefox loads the page -- leaving all that white space gap in between. When I hit refresh on the browser, it sometimes gets cleared up and jumps back up into place. Other times it reverts back down. This doesn't happen in IE -- only Firefox and Mozilla. I figured this has something to do with the way the float is set for that div, but who knows what it could be given the crazy markup order of the page (which was necessary to preserve the design). Here are my 2 template pages below. From the index page, click on the left orange blocks which say Click this Title to see the same effect on the subsequent page. http://www.geocities.com/craiggivens01/index.html http://www.geocities.com/craiggivens01/page2.html It usually happens on a first load of the page. If not, Hit the back button from page2.html and try clicking on the link once more to get the page to re-load. Any advice you can offer on fixing this or any other helpful tips in tightening the CSS is much APPRECIATED! - Craig __ 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] Scrollbar In Firefox adjusting layout.
When the page requires a scrollbar firefox pushes the contents of the window over. There was a post a few issues back that suggest this: html { height: 100%; margin-bottom: 1px; } this does work, but it permanently adds a scrollbar that scrolls 1px to all pages regardless if the contents fit the height of the window. Is it just me that gets a scrollbar that scrolls 1px? Is there a way to have no scrollbar when not needed yet the layout not be adjusted when Firefox adds one? Thanks in advance, John G __ 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] Min-Height Fix/Hack?
Hi - Does anyone know a good min-height fix/hack that would work for my page: http://home.bellsouth.net/p/PWP-dzine I'm trying to get the body text not to bleed over the footer and expand gracefully. The same effect happens on page2.html - which is linked from that homepage. I've tried this code: contents { width:970px; background:#ff; display: table; min-height:500px; height:auto !important; height:500px; } but that didn't seem to work well. thanks for any help! -Craig __ 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] What's wrong with my line-height calculations?
On Mon, 9 Apr 2007, Jukka K. Korpela wrote unless I'm missing something, Windows internally expresses font sizes in points For the screen Windows internally expresses font sizes in pixels. http://msdn.microsoft.com/library/default.asp?url=/library/en-us/gdi/fon text_8fp0.asp The CreateFont function creates a logical font with the specified characteristics. The logical font can subsequently be selected as the font for any device. The height of the font (nHeight) specifies the height, in logical units, of the font's character cell or character. A logical font is the specification of the font one actually wants. The device here is the screen and the logical units for a screen are pixels. For the CreateFont GDI function: If the value of nHeight is, say, 20 then one is requesting a font height of 20 pixels. If the value of nHeight is -20 then one is requesting a font size of 20 pixels. www.emdpi.com/fontsize.html -- Richard Mason __ 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] Scrollbar In Firefox adjusting layout.
John, On Apr 5, 2007, at 5:33 PM, Johnny G's wrote: Is there a way to have no scrollbar when not needed yet the layout not be adjusted when Firefox adds one? Only if you are willing to use a layout that is left aligned. Roger, -- Roger Roelofs [EMAIL PROTECTED] __ 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] Setting the right page text margin
I am wondering about how to set the right margin for: http://mypracticesite.com Also, a special thanks to Mauricio Samy Silva who helped me with a text drop issue. Thanks in advance. This service is great! John Shepard CSS novitiate __ 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] Setting the right page text margin
Hi John, The #globalContainer is 825px wide, so it is greater than the intended page width 760px. The diference 825 - 760 = 65px is causing your main content to be shoved to the right. Assigning #globalContainer { width: 760px; ...} will fix. Regards Mauricio Samy Silva - Original Message - From: John M Shepard [EMAIL PROTECTED] To: css-d@lists.css-discuss.org Sent: Monday, April 09, 2007 3:04 PM Subject: [css-d] Setting the right page text margin I am wondering about how to set the right margin for: http://mypracticesite.com Also, a special thanks to Mauricio Samy Silva who helped me with a text drop issue. Thanks in advance. This service is great! John Shepard CSS novitiate __ 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-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] Web calendar
Chris Rahe wrote: I'm pretty new to css, table-less design but I'm trying to get up to speed quickly. I had to put a calendar on the web and I tried to come up with a useful way to do it using CSS and no tables. Does anyone mind taking a look at http://www.bremenhospital.org/Clinics/0407mos.html and offering some feedback? I included the CSS in the HTML page just for simplicity's sake. Thanks. Looks ok in Firefox and IE 6 7. Your design is a little unusual, but hey, it works! Some of the folks on this list might be tempted to use div's for each day and paragraphs for the contents, but that would be harder to get working across browser-land. Maybe something you can play with if you have time... and patience :-) Lori __ 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] Web calendar
On 04/04/07, Chris Rahe [EMAIL PROTECTED] wrote: I'm pretty new to css, table-less design but I'm trying to get up to speed quickly. I had to put a calendar on the web and I tried to come up with a useful way to do it using CSS and no tables. So you've got some columns where every cell represents instance of the same day of the week, and you have some rows where every cell presents a day in a particular week ... and you didn't use a table? And if you turn of style sheets (remembering that documents should be usable without CSS being available) you get: April 2007 CHB Medical Office Suites Sunday Monday Tuesday Wednesday Thursday Friday Saturday 1 2 Scott Emerick, MD (General Surgery) 9A-2P ... I suggest switching to use a table for your data structure. -- David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk __ 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] Site Check Request
Robert DeLaurentis wrote: I would appreciate anyone who takes the time to look at my site and lets me know how its working on their browsers. This is my first all- CSS site. I tried to use minimal number of classes, ids for major layouy divs only, and as little non-standard cruft as possible. http://sbwc2.bobdel.com/about_director.php http://sbwc2.bobdel.com/css/main.css Each page validates XHTML 1.0 Strict (except for a two legacy pages that use frames and a couple that depend on mySQL). CSS also validates. Actually, I get an unexpected end of XML source error on line 34 in the about_director page and 98 warnings. There are several outstanding issues that I know about, and don't yet know how to fix: In IE 6, the drop down menu, the entire box for the first entry is clickable, yet the subsequent boxes only the text link is hot. Also in IE 6, there is a 1 pixel white line that appears on the right of the header graphic when the window is resized to some, but not all, widths. And finally, I'd like to be able to center the entire nav bar inside its container div, but am not sure how to make that work. Thank you! Bob I think you have to surround the text in the anchors with a span to make the entire box clickable in ie. Do a Google search on ie clickable region fix and you will get a bunch of links to various solutions. There's even been some discussion about this on the list, no surprise there. Centering block level elements is accomplished by setting the left and right margins to auto. You may have to create another nested division in the nav bar to do that. This doesn't work in IE 6, but you can usually accomplish the same thing by doing text-align: center for IE. You might want to fix up a few of these issues and then post another question for any specific problems that still remain. I think you message may have been lost a bit. Posting a question to a specific problem might generate more replies. Lori __ 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] Web calendar
David Dorward wrote: On 04/04/07, Chris Rahe [EMAIL PROTECTED] wrote: I'm pretty new to css, table-less design but I'm trying to get up to speed quickly. I had to put a calendar on the web and I tried to come up with a useful way to do it using CSS and no tables. snip ... I suggest switching to use a table for your data structure. First it looks very nice! Second, it shows why you don't use overly descriptive terms for the classes and id's. Every day is classed Sunday. It makes no real difference, but still. Third, if you don't expect people to have styles off I suppose ... then do you worry about it? I think you may do well to experiment with the use of unordered lists or maybe even definition lists which may help with the issue that is mentioned there. I haven't thought about it at length, but I think it can be done. I presume you are dynamically going to generate this in the end? __ 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] Scrollbar In Firefox adjusting layout.
Johnny G's wrote: When the page requires a scrollbar firefox pushes the contents of the window over. There was a post a few issues back that suggest this: html { height: 100%; margin-bottom: 1px; } this does work, but it permanently adds a scrollbar that scrolls 1px to all pages regardless if the contents fit the height of the window. Is it just me that gets a scrollbar that scrolls 1px? Is there a way to have no scrollbar when not needed yet the layout not be adjusted when Firefox adds one? Thanks in advance, John G This is a known problem in FF. Another solution is to set the height on the html element to 101% - then you don't need the bottom margin. However you still wind up with a scrollbar that scrolls nowhere :-) I think your only other option is to let the content flow to the width of the browser window. Lori __ 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] Weird Firefox/mozilla refreshing and jumping issue
Craig Givens wrote: ... Here are screencaps of the problem. This is running on FF 1.5-2.0 Windows: http://www.geocities.com/craiggivens01/screen.jpg http://www.geocities.com/craiggivens01/screen2.jpg That left column div (called leftColumn-home and leftColumn in the css) sometimes renders way down below the fold when Firefox loads the page -- leaving all that white space gap in between. When I hit refresh on the browser, it sometimes gets cleared up and jumps back up into place. Other times it reverts back down. This doesn't happen in IE -- only Firefox and Mozilla. I figured this has something to do with the way the float is set for that div, but who knows what it could be given the crazy markup order of the page (which was necessary to preserve the design). Here are my 2 template pages below. From the index page, click on the left orange blocks which say Click this Title to see the same effect on the subsequent page. http://www.geocities.com/craiggivens01/index.html http://www.geocities.com/craiggivens01/page2.html It usually happens on a first load of the page. If not, Hit the back button from page2.html and try clicking on the link once more to get the page to re-load. ... You are declaring display:table on #contents. div#contents contains #topicheader, #rightColumn, #leftColumn. We've seen similar issues related to display:table in Fx [1]. An element coming too late, depending on the connection, will land in a next generated anonymous table-row. The reason you are using display:table is most probably because of the containment of floats in this new block formatting context. I'd try another float containing method. Please report back if it fixes the problem. Ingo [1] http://archivist.incutio.com/viewlist/css-discuss/82716 -- http://www.satzansatz.de/css.html __ 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] Web calendar
Thanks for the feedback. I've gotten so wrapped up in trying to learn table-less design that I guess the obvious appropriateness to the use of tables in this instance escaped me. I think it would be best just to use a table for my calendars, but it's been good practice anyway. Chris Rahe Executive Director of Marketing and Development 1020 High Road - P. O. Box 8 Bremen, IN 46506 Telephone 574.546.8011 Facsimile 574.546.4312 Email - [EMAIL PROTECTED] -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Don - HtmlFixIt.com Sent: Monday, April 09, 2007 12:54 PM To: David Dorward Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] Web calendar David Dorward wrote: On 04/04/07, Chris Rahe [EMAIL PROTECTED] wrote: I'm pretty new to css, table-less design but I'm trying to get up to speed quickly. I had to put a calendar on the web and I tried to come up with a useful way to do it using CSS and no tables. snip ... I suggest switching to use a table for your data structure. First it looks very nice! Second, it shows why you don't use overly descriptive terms for the classes and id's. Every day is classed Sunday. It makes no real difference, but still. Third, if you don't expect people to have styles off I suppose ... then do you worry about it? I think you may do well to experiment with the use of unordered lists or maybe even definition lists which may help with the issue that is mentioned there. I haven't thought about it at length, but I think it can be done. I presume you are dynamically going to generate this in the end? __ 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-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] Web calendar
On 09/04/07, Don - HtmlFixIt.com [EMAIL PROTECTED] wrote: ... I suggest switching to use a table for your data structure. Third, if you don't expect people to have styles off I suppose ... then do you worry about it? Yes - Inaccessible websites have legal implications in many jurisdictions, and users don't always do what you expect. I think you may do well to experiment with the use of unordered lists or This wouldn't allow you to relate a day to a week or a day of the week, and if it was a list, then order would be relevant. maybe even definition lists which may help with the issue that is mentioned there. You aren't defining terms, and definition lists don't describe a two dimensional relationship. -- David Dorward http://dorward.me.ukhttp://blog.dorward.me.uk __ 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] decapitated picture (Ian Young)
Dave dolefully wrote: Well, good ol' IE6 does it again. On this page, the top left pic is chopped in half. Don't know why. To which Ian intoned: the margin-top:-3em; in the content is the culprit And Georg Gracefully added: Add 'position: relative' to the image in question, to fix IE6' stacking over the edge problems. Good for you that you don't have to fix anything else :-) Ian and Georg, Thank you TONS for your assistance! Of course it worked. Have a great day! Best Regards, ;-Dave __ 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] decapitated picture (Ian Young)
Dave dolefully wrote: Well, good ol' IE6 does it again. On this page, the top left pic is chopped in half. Don't know why. To which Ian intoned: the margin-top:-3em; in the content is the culprit And Georg Gracefully added: Add 'position: relative' to the image in question, to fix IE6' stacking over the edge problems. Good for you that you don't have to fix anything else :-) Ian and Georg, Thank you TONS for your assistance! Of course it worked. Have a great day! My pleasure - glad to be able to put something back. I have had so much help from these guys. Cheers Ian -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.446 / Virus Database: 269.0.0/752 - Release Date: 08/04/2007 20:34 __ 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] Weird Firefox/mozilla refreshing and jumping issue
Hi Ingo - Thanks for responding. display:table is the only method that works. Using anything else for #contents will cause the #rightColumn to appear underneath the #contents div or render otherwise incorrectly That #rightColumn is tricky -- it needs to stay within #contents but with a negative margin so that it overlaps and floats on top to the right. We wanted #rightColumn placed where it is in the markup for the screen reading order (Accessibility/) as well as keeping with the vision from the designer. I've been racking my brain for weeks trying to figure this one out, but no luck so far. If you have any other advice or hacks/tricks -- I'm all ears. - Craig On 4/9/07, Ingo Chao [EMAIL PROTECTED] wrote: Craig Givens wrote: ... Here are screencaps of the problem. This is running on FF 1.5-2.0 Windows: http://www.geocities.com/craiggivens01/screen.jpg http://www.geocities.com/craiggivens01/screen2.jpg That left column div (called leftColumn-home and leftColumn in the css) sometimes renders way down below the fold when Firefox loads the page -- leaving all that white space gap in between. When I hit refresh on the browser, it sometimes gets cleared up and jumps back up into place. Other times it reverts back down. This doesn't happen in IE -- only Firefox and Mozilla. I figured this has something to do with the way the float is set for that div, but who knows what it could be given the crazy markup order of the page (which was necessary to preserve the design). Here are my 2 template pages below. From the index page, click on the left orange blocks which say Click this Title to see the same effect on the subsequent page. http://www.geocities.com/craiggivens01/index.html http://www.geocities.com/craiggivens01/page2.html It usually happens on a first load of the page. If not, Hit the back button from page2.html and try clicking on the link once more to get the page to re-load. ... You are declaring display:table on #contents. div#contents contains #topicheader, #rightColumn, #leftColumn. We've seen similar issues related to display:table in Fx [1]. An element coming too late, depending on the connection, will land in a next generated anonymous table-row. The reason you are using display:table is most probably because of the containment of floats in this new block formatting context. I'd try another float containing method. Please report back if it fixes the problem. Ingo [1] http://archivist.incutio.com/viewlist/css-discuss/82716 -- http://www.satzansatz.de/css.html __ 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] Weird Firefox/mozilla refreshing and jumping issue
To keep this thread updated with the results of some off-list correspondence... Craig Givens wrote: display:table is the only method that works. Using anything else for #contents will cause the #rightColumn to appear underneath the #contents div or render otherwise incorrectly Not so. It's the mix of absolute positioned and floating elements inside #contents that is causing most problems now. No absolute positioning should be used there, and the floats will contain floats behavior will solve the rest. Replace the styles you have - *all of them* - for the two elements in question, with the following... #contents { background:#fff; float: left; width: 100%; } #leftColumn-home { margin-left: 5px; float:left; display: inline /* fix IE6 bug */ } ...and the containment and alignment problems will be solved across browser-land. regards Georg -- http://www.gunlaug.no __ 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] Weird Firefox/mozilla refreshing and jumping issue
This is great!. Thanks for the quick response. I will let you know how it tests out. On 4/10/07, Gunlaug Sørtun [EMAIL PROTECTED] wrote: To keep this thread updated with the results of some off-list correspondence... Craig Givens wrote: display:table is the only method that works. Using anything else for #contents will cause the #rightColumn to appear underneath the #contents div or render otherwise incorrectly Not so. It's the mix of absolute positioned and floating elements inside #contents that is causing most problems now. No absolute positioning should be used there, and the floats will contain floats behavior will solve the rest. Replace the styles you have - *all of them* - for the two elements in question, with the following... #contents { background:#fff; float: left; width: 100%; } #leftColumn-home { margin-left: 5px; float:left; display: inline /* fix IE6 bug */ } ...and the containment and alignment problems will be solved across browser-land. regards Georg -- http://www.gunlaug.no __ 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/