|
| |
|
|
Nicole
Posts: 2830 Joined: 9/15/2004 From: Nambucca / Kempsey, Australia Status: offline
|
My Page of Problems... - 6/15/2006 6:40:06
I’ve created a dummy page with all the problems I’m experiencing on it. Strangely, I haven’t been able to re-create all the problems even by cutting and pasting the exact code from the real problem pages into this test page, nonetheless I’ll mention them in case they happen to anyone else. My Page Of Problems Issue 1: I usually design to allow a user to resize the text twice using their browser resizer. When increasing text size twice in this way using Internet Explorer 5.0, 5.5 and 6, the left side div (the menu and logos) drops to below the content. This is obviously unacceptable. I’m still seeing the menu drop to below the content in IE (all versions) when text is increased to largest using the browser text-resizer. It’s not happening using the largest text setting on the text-resizer on the page itself. This is happening despite two other people telling me that it’s not happening in IE for them. My fear is though, if it’s happening for me, then it will probably be happening to others. Can people try this please and respond as to whether it’s happening or not? Issue 2: Now this is strange. I had a lot of trouble initially telling all browsers how to style a link in the content. An example is the end of the first paragraph where there’s a link to the contact form. (this is one of the problems I’m having trouble re-creating although on the real page the words do not become underlined when hovered over in Firefox. In addition to this, on the advice of somebody, I’ve added the following styles to the top of my style sheet: a:link, a:visited { color: #444; text-decoration: none; } a:hover, a:focus { text-decoration: underline; } Which has solved the problem overall, except in Firefox which just doesn’t want to underline the link and displays it in black instead of #444 which is the font color for the rest of the content. Also, since this piece of code has been added, all browsers except Internet Explorer want to underline the skip link destination (the page headings) when hovered over. Issue 3: In Netscape 8.0, when text-size is increased twice using the browsers text-resizer, the banner vanishes after scrolling down the page and back to the top. It also puts a huge white space under the disclaimer include at the bottom. The strange thing is that this only happens the first time you open the site having cleared the cache. In other words it’s not happening once the site has been viewed, or at least one other page has been viewed within the site and it’s also only happening when the text is resized twice. Issue 4: In Netscape and Mozilla, when text is resized twice using the browser settings, the top border of the disclaimer (the text in the box with the red border at the bottom of the page) disappears but only on two pages within a 30 or so page site. I’ve copied the code into this test page but again I can’t seem to re-create the problem here Issue 5: Overall problems with data table alignment in different browsers. The Mozilla browsers, which presumably display them correctly show them slightly indented from the rest of the content, Internet Explorer displays them too far left aligned and Opera shows them the same as FF/MZ/NN. The same problem exists with images that are “centered” amongst the text (i.e. not floating right), but Internet Explorer displays them as I intend them to be displayed. I’m sure these are “box model” issues, but as yet I’ve not found a solution. Some of these issues are a bit petty, but it’s strange nonetheless. I agree with others that sites needn’t appear “exactly” the same in all browsers but my concern is that if Firefox isn’t displaying them anything like I’m intending them to, then something is obviously wrong. Nicole
_____________________________
|
|
|
|
Tailslide
Posts: 6032 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline
|
RE: My Page of Problems... - 6/15/2006 7:39:34
Issue 1: You've got a margin on the menu li which is specified in ems - this is probably the reason as you've got no room to manoeuvre as far as a gap between the content and the menu - there's no space that the menu can grow into so it breaks. Get rid of the ems and replace it with px (if you're using a fixed width layout then you need to use px for margins, padding and widths - not fonts though!). See if that helps Issue 2: Looks fine to me in FF and IE - definitely #444. When it's visited it becomes black so it may be a cache issue on your pc. If you stick those link rules into your stylesheet then they will apply to all links on the page unless you've specified another, contradictory rule. so if you've specified that the skip links shouldn't be underlined on hover then they shouldn't be. If you haven't then this rule will apply. Issue 3: sounds like a bug - have a look round "position is everything" and see if you can track it down. Issue 4: can't recreate top border problem. All I can think of is to take the background colour off the previous and next divs (ensure that the larger containing area has a background colour specified. It may be that the disclaimer div is disappearing up underneath the one above. Issue 5: Can't see any reason to float this table so just have it in the normal "flow" of the page and mess with the margins till you get it where you want.
_____________________________
"My strategy is so simple an idiot could have devised it" Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
|
|
|
|
c1sissy
Posts: 5084 Joined: 7/20/2002 From: NJ Status: offline
|
RE: My Page of Problems... - 6/15/2006 8:45:02
Not sure if this will help or not, but do this: html, body {font-size: 100.01%;} I can increase my font size more then twice on my pages and it doesn't mess anything up. This takes care of bugs in the browsers with font sizing.
_____________________________
Deb-aka-c4Ksissy high panjandurum and alpha female of the silverback tribe As decreed by Jesper 5-24-2003. The only stupid question is... the one that is never asked!! http://directory.css-styling.com http://fmsforum.com http://positioniseverything.net/ http://www.tanfa.co.uk/
|
|
|
|
c1sissy
Posts: 5084 Joined: 7/20/2002 From: NJ Status: offline
|
RE: My Page of Problems... - 6/15/2006 9:23:27
Its a trick from BigJohn, I'm sure that PIE has something on it. It does work though. Many have doubted, tried and found that it works. I set it like that, then I use ems for my font sizing, and it works really good. I can test the page and go to the largest size and nothing falls apart on me.
_____________________________
Deb-aka-c4Ksissy high panjandurum and alpha female of the silverback tribe As decreed by Jesper 5-24-2003. The only stupid question is... the one that is never asked!! http://directory.css-styling.com http://fmsforum.com http://positioniseverything.net/ http://www.tanfa.co.uk/
|
|
|
|
Tailslide
Posts: 6032 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline
|
RE: My Page of Problems... - 6/15/2006 9:37:27
I always use 100.01% on the body element too - then somewhere around 76% on the lower items. Here's the reason: From: css-discuss.incutio.comquote:
Simply put, IE for Windows' relative font size inheritance cascade is broken. The simplest workaround is to not use relative sizes, such as using keywords instead, except on base level containers. If you find it necessary to size through cascade, you'll find % works more reliably than ems. If you prefer using ems to %, then at least set the initial size using % instead, thus: html {font-size: 100.01%;} or body {font-size: 100.01%;} . This eliminates most size inheritance errors. Using 100.01% instead of 100% avoids size inheritance bugs in some versions of Opera.
_____________________________
"My strategy is so simple an idiot could have devised it" Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
|
|
New Messages |
No New Messages |
Hot Topic w/ New Messages |
Hot Topic w/o New Messages |
Locked w/ New Messages |
Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|