Click to See Complete Forum and Search --> : scrambled page elements
catfish
09-22-2009, 08:16 PM
This is really frustrating. I've completed a website for a client. She was very happy with it and rushed me to get it online for a radio ad coming up. Now she emailed me this screen shot today and the page is all scrambled with elements overlapping. Thing is that I have viewed it on more than 1 computer, viewed in on my own in Safari, FF, IE an Opera. They all look good. I then downloaded screen shots from browsershots.org. A couple shots don't look right but none I have even heard of. Her screen shot she sent me shows that she is viewing it with IE, version I don't know but in the browsershots.org all of the IE XP 8.0, 5.5, 6.0 and 7.0 look good. Could it just be here computer? Don't know what to do here.
Here is a link, I always appreciate help from the experts. Thanks :(
www.islandpharmacy.ca/
catfish
09-22-2009, 09:19 PM
I wanted to add a screenshot that the client sent me too
13121
opifex
09-23-2009, 12:18 AM
Client has zoomed in "TEXT-ONLY"... you can replicate it in firefox by selecting "Zoom Text Only." They had to zoom in because the font-size is too small to read.
catfish
09-23-2009, 12:39 AM
Ok, yes I see what you mean, so that comes down to changing my font sizing in the css so everyone can read it easily which is hard designing because viewers have the option of setting their own text size to large if they want so here is the code that I think I have been using most of the time and it looks good on all the computers I've viewed on. What are you using?
catfish
09-23-2009, 01:25 AM
Here is another link. Do you think it will be better for most viewers?
http://www.islandpharmacy.ca/text-trial.html
opifex
09-23-2009, 01:37 AM
Depends on the project, but generally I set font-family: Arial, sans-serif;
font-size: 15px;
line-height: 17px;
font-weight: 400;
or something simila ras global and then use percentages as needed in other sections.
Lots of people will argue about this approach, but it works well for my clients.
catfish
09-23-2009, 01:41 AM
Thankyou for your help, I know there are many different methods. I'll do some more reading as well. Thanks again for reading my post.
opifex
09-23-2009, 02:57 AM
The new trial page is a little better.... you are mixing ems, px and % all over the place for your font sizes and that can get a little confusing to relate to sometimes, and since you aren't specifying a font-family the client will see the default font set by their browser. Same with setting font-size at 100%... it will be 100% 0f the default font-size set in the browser. Keep tweaking it!
catfish
09-23-2009, 11:05 AM
Thankyou for the help, I thought the way to go these days was with em? I've changed all the font sizes to px and % now. So when you set the px size the viewer cannot change this by increasing their own text size in the browser, correct? But how does this method look for one person that has a very high screen resolution and another using 1024x768? Here is another trial page using the px and %
http://www.islandpharmacy.ca/font-change.html