Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.5a is a product of Lussumo. More Information: Documentation, Community Support.
-
I need some help fixing a site I'm working on. It displays correctly so far in the latest Firefox and IE7, however IE6 just isn't even in the ball park. Here are the links:
page
http://www.coastalpet.com/remington/index.html
css
http://www.coastalpet.com/remington/styles.css
Any suggestions?
Thanks! -
-
CommentAuthoradjustafresh
- CommentTimeAug 16th 2007 edited
-
-
Thank you for your suggestion. Are there any better alternatives? It's such a pain to have to do two style sheets.
Thanks! -
Just use conditional comments to fix the things that IE6 breaks. That is the best solution.
-
-
CommentAuthorkari.patila
- CommentTimeAug 16th 2007
Those torn edges seem to have a life of their own, on my screen at least, when you scroll up. They look like they're trying to stick to the screen a bit while the other stuff keeps scrolling. -
-
-
CommentAuthoradjustafresh
- CommentTimeAug 16th 2007
Yes, it is a pain to have to create multiple style sheets. Welcome to the world of web development. -
-
-
CommentAuthorDarren Hoyt
- CommentTimeAug 16th 2007 edited
You could make torn_edges.png the background image of the "content-tornedges" id, then you can remove it as an image in the body. Then you could just place your search box within that div.
On that note, the layout for this page is straightforward and shouldn't need any tricky absolute positioning. IE is not to blame for the display issues you're having, the code just needs some work. I realize it's subjective, but absolute positioning is one of those things I've only found necessary once or twice in 10 years of design. It seems to be the most unnecessarily overused element at the root of many CSS problems seen on this forum, especially when it comes to IE. There are always methods of getting a CSS layout to work without relying on positioning, multiple stylesheets or workarounds -- for starters, get used to imagining your page elements snapping together in a grid, rather than floating on top of one another 3-dimensionally. Hope this helps. -
-
- CommentAuthorljromanoff
- CommentTimeAug 17th 2007
I recommend adding a style reset such as Eric Meyer's (http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/) to your style sheet first. This will at least produce a more consistent cross browser experience. Once you've done that, use conditionals to fix whatever IE6 still does incorrectly. I'm also still a fan of the underscore hack, but that will likely produce an argument from some people. -
-
CommentAuthoradjustafresh
- CommentTimeAug 18th 2007 edited
A few points.
#1 - I didn't have the time or the inclination to review Jay's style sheet.
#2 - In general Darren is spot on. When programmed correctly the need for IE specific styles should be minimal. Absolute positioning has its purposes, but generally it is NOT for laying out large page areas/containers. Absolute positioning is great for placing specific elements within a larger container e.g. a logo within a header div.
#3 - LJR also makes a good point about resetting browser defaults--this will help keep the need for IE hacks down
No matter how well you write your style sheet you will normally have a need to create styles specifically for IE; it's the worst part of the job. Personally, I use conditional comments to target IE. Within my IE-specific style sheet I use the underscore hack that LJR mentioned to target IE versions below 7. -
-
Totally agree with everything adjustafresh just listed.
1 to 10 of 10