so many browsers, local setting problems:(

[ristenk1]

I feel like I'm back to square one although I changed all of my fonts to px so that when they are zoomed in it doesn't break the design. I'm going to try and paste a screen shot of my problem. I have checked this site on different browsers and operating systems... and it has worked but it is just not working on my clients computer and it is driving me crazy because I don't know if it is a local setting (it must be because they use firefox version 3.5.3 on a windows xp version 2002, with no zoom and it should work on that!) It looks like the font that I set in px (which is being controlled by h1, h2 etc) is being increased...but how could this be? I know the client did not change the size of text on their operating system nor in their browser - through tools and options - so how could this be?

Thanks!

...can't paste screen shot...ok, so problem is just that the text is being displayed bigger on my clients computer and I checked their zoom and it is normal...can't figure out what else it could be

html:
<div id="boxb_text1_services"> <h3 align="center" class="style1">A Year Round Tree Expert Company provides full service tree care:</h3>

</div>

<div id="boxb_text2_services"><h4 align="center" class="style2">Tree and Shrub Removal<br/>

Pruning and Trimming<br/>

Stump Grinding<br/>
Storm Damage Service<br/>

Insect and Disease Diagnosis Treatment<br/>

Fertilization</h4></div>

<div id="boxb_text3_services"><h5 align="center" class="style3"> Storm Removal Service<br/>

Commercial &amp; Residential</h5></div>

css:

html {
height:100%;
margin:0;
padding:0;
}

body {
background-color:#13882D;
background-image:url(Redone/images/background1.png);
background-repeat:repeat-x;
height:100%;
margin:0 auto;
padding:0;
text-align:center;
}

#holder {
background-color:#FFFFFF;
border:medium none;
height:744px;
margin:0 auto;
padding:10px;
position:relative;
text-align:left;
width:800px;
}

#ayearround {
color:#128F33;
font-family:Helvetica,arial,sans-serif;
font-size:20px;
left:40px;
position:absolute;
top:120px;
}

#treeexpert_etc {
color:#128F33;
font-family:Helvetica,arial,sans-serif;
font-size:20px;
left:40px;
position:absolute;
top:140px;
}

#proudly_etc {
color:#128F33;
font-family:Helvetica,arial,sans-serif;
font-size:18px;
left:288px;
position:absolute;
top:100px;
z-index:53;
}

#phone_middle {
color:#128F33;
font-family:Helvetica,arial,sans-serif;
font-size:20px;
left:380px;
position:absolute;
top:105px;
z-index:54;
}

#phonenumbers {
color:#828181;
font-family:Helvetica,arial,sans-serif;
font-size:9px;
left:672px;
position:absolute;
top:11px;
}

#logo {
left:48px;
position:absolute;
top:11px;
}

#home1 {
font-size:16px;
left:225px;
position:absolute;
top:70px;
}

#services1 {
font-size:16px;
left:310px;
position:absolute;
top:70px;
}

#ourwork1 {
font-size:16px;
left:410px;
position:absolute;
top:70px;
}

#whoweare1 {
font-size:16px;
left:510px;
position:absolute;
top:70px;
}

#contact1 {
font-size:16px;
left:615px;
position:absolute;
top:70px;
}

#horizontal_line {
left:170px;
position:absolute;
top:86px;
}

#picture {
left:80px;
position:absolute;
top:180px;
}

img {
border-style:none;
}

a {
color:#128F33;
text-decoration:none;
}

#copyright {
left:650px;
position:absolute;
top:752px;
}

#home2 {
left:13px;
position:absolute;
top:742px;
}

#services2 {
left:56px;
position:absolute;
top:740px;
}

#ourwork2 {
left:119px;
position:absolute;
top:742px;
}

#whoweare2 {
left:195px;
position:absolute;
top:739px;
}

#contact2 {
left:283px;
position:absolute;
top:740px;
}

#blog {
left:353px;
position:absolute;
top:740px;
}

.treeservice {
font-size:20px;
}

[Uncle Dog]

Where are the style definitions for the classes style1, style2, style3?
I suspect you're using dreamweaver aren't you? It will have created these definitions in the head of the html document. Please show us what they define.

[ristenk1]

I was using the styles for my IE conditional page:

/* "All Template" Begins in Conditional*/

#holder {
margin: 0 auto;
padding:22px;
position:relative;
border:none;
}

.ayearround {
position:absolute;
left:25px;
top:120px;
font-size:20px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:9;
}

.treeexpert_etc {
position:absolute;
left:25px;
top:142px;
font-size:20px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:10;
}

.proudly_etc {
float:left;
position:absolute;
left:285px;
top:105px;
font-size:18px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:11;
}

.phone_middle {
float:left;
position:absolute;
left:380px;
top:125px;
font-size:20px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:12;
}

.iefix{
font-size:18px


}

.iefix2{
font-size:12px

}

#holder {
height:733px;
}

#copyright {
position:absolute;
right:15px;
top:755px;
}

#home2 {
position:absolute;
left:13px;
top:756px;
}

#services2 {
position:absolute;
left:56px;
top:754px;
}

#ourwork2 {
position:absolute;
left:119px;
top:756px;
}

#whoweare2 {
position:absolute;
left:195px;
top:753px;
}

#contact2 {
position:absolute;
left:283px;
top:754px;
}

#blog {
position:absolute;
left:353px;
top:754px;
}

#box2 {
float:none;
position:absolute;
top:364px;
right:87px;
}


/* "All Template" Ends in Conditional*/

/* "Index" Begins in Conditional*/

#box1_text {
position:absolute;
top:380px;
left:205px;
font-size:14px;
font-style:normal;
color:#128f33;
z-index:17;
}

#box2_text {
position:absolute;
top:375px;
right:137px;
font-size:11px;
color:#128f33;
z-index:20;
}

#leaves {
position:absolute;
top:560px;
right:190px;
}

/* "Index" Ends in Conditional */

/* "Who We Are" Begins in Conditional*/

#box1_text_whoweare{
top:375px;

}

#box1b_text_whoweare {
top:392px;
left:120px;
width: 385px;

}

#box1a_text_whoweare {
top:417px;
left:100px;
width: 385px;
}


.style1_whoweare {
font-size:16px;
}
.style2_whoweare {
font-size:10px;
}
.style3_whoweare{
font-size:12px;
}

#box2_text_whoweare {
top:377px;
left:544px;
width:200px;
}

#box2a_text_whoweare {
top:513px;
left:544px;
width:200px;
}

#box2b_text_whoweare {
top:632px;
left:544px;
width:200px;
}

#holder {
height:735px;
}

/* "Who We Are" Ends in Conditional*/

/* "Services" Begins in Conditional*/

#boxb_text1_services {
top:373px;
left:100px;
}

#boxb_text2_services {
top:410px;
left:115px;

}

#boxb_text3_services {
top:630px;
left:230px;
}

.style1 {
font-size:21px;
}
.style2 {
font-size:16px;
}
.style3{
font-size:16px;
}

#holder {
height:733px;
}


/* "Services" Ends in Conditional*/

/* "Our Work" Begins in Conditional*/

#boxb_text1_ourwork {
top:373px;
left:100px;
}

#boxb_text2_ourwork {
top:410px;
left:115px;

}

#boxb_text3_ourwork {
top:630px;
left:230px;
}

.style1 {
font-size:21px;
}
.style2 {
font-size:16px;
}
.style3{
font-size:16px;
}

#holder {
height:733px;
}

/* "Our Work" Ends in Conditional*/

/* "Contact" Begins in Conditional*/

#boxb_text1_contact {
top:373px;
left:150px;
}

#boxb_text2_contact {
top:410px;
left:110px;

}

#boxb_text3_contact {
top:630px;
left:60px;
}

#boxb_text4_contact {
top:630px;
left:225px;
}

#boxb_text5_contact {
top:635px;
left:390px;
}

.style1 {
font-size:22px;
}
.style2 {
font-size:15px;
}
.style3{
font-size:12px;
}

.style4{
font-size:12px;
}

.style5{
font-size:12px;
}
#holder {
height:733px;
}

/* "Contact" Ends in Conditional*/

[ristenk1]

This is the correct IE css style sheet:

/* "All Template" Begins in Conditional*/

body{
margin:0 auto; padding:0; text-align:center;
}

#holder {
position:relative;
height:733px;
width:800px; margin:0 auto; text-align:left;
padding:22px;
border:none;
}

#ayearround {
position:absolute;
left:40px;
top:120px;
font-size:20px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:9;
}

#treeexpert_etc {
position:absolute;
left:40px;
top:140px;
font-size:20px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:10;
}

#proudly_etc {
position:absolute;
left:300px;
top:105px;
font-size:18px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:11;
}

#phone_middle {
position:absolute;
left:390px;
top:127px;
font-size:20px;
font-family: Helvetica, arial, sans-serif;
color:#128f33;
z-index:12;
}

#phonenumbers {
position:absolute;
left:672px;
top:11px;
color:#828181;
font-size:9px;
font-family: Helvetica, arial, sans-serif;
}

#logo {
float:left;
position:absolute;
left:48px;
top:11px;
}

#menubar_box {
position:absolute;
left:157px;
top:68px;
border:none;
background-color:#ffffff;
width:600px;
height:45px;
}

ul#topnav {text-align: center;}

ul#topnav li{
font-size:16px;
color:#128f33;
left:0px;
top:8px;
display:inline;
list-style:none;
align:center;
padding:0;
}

ul#topnav li a {
text-decoration:none;
color:#128f33;
padding:18px 16px 26px;
}

#horizontal_line{
position:absolute;
left:170px;
top:86px;
/*width:500px;
height:3px;
background-color:#128f33;
border-color:#128f33;*/
}

#box1 {
position:absolute;
top:360px;
left:80px;
}

#box2 {
position:absolute;
top:364px;
left:530px;
}

#copyright {
position:absolute;
left:670px;
top:755px;
}

#home2 {
position:absolute;
left:13px;
top:756px;
}

#services2 {
position:absolute;
left:56px;
top:754px;
}

#ourwork2 {
position:absolute;
left:119px;
top:756px;
}

#whoweare2 {
position:absolute;
left:195px;
top:753px;
}

#contact2 {
position:absolute;
left:283px;
top:754px;
}

#blog {
position:absolute;
left:353px;
top:754px;
}


/* "All Template" Ends in Conditional*/

/* "Index" Begins in Conditional*/

#box1_text {
position:absolute;
top:380px;
left:190px;
font-size:14px;
font-style:normal;
color:#128f33;
z-index:17;
}

#box2_text {
position:absolute;
top:385px;
left:580px;
font-size:11px;
color:#128f33;
z-index:20;
}
.treeservice2{
font-size:24px;
}

.iefix_pruning{
font-size:18px

}

.iefix2_fullservice{
font-size:12px

}

#leaves {
position:absolute;
top:565px;
right:205px;
}

/* "Index" Ends in Conditional */

/* "Who We Are" Begins in Conditional*/

#box1_text_whoweare{
top:375px;

}

#box1b_text_whoweare {
top:392px;
left:120px;
width: 385px;

}

#box1a_text_whoweare {
top:417px;
left:100px;
width: 385px;
}


.style1_whoweare {
font-size:16px;
}
.style2_whoweare {
font-size:10px;
}
.style3_whoweare{
font-size:12px;
}
.style4_whoweare{
font-size:10px;
}

#box2_text_whoweare {
top:377px;
left:544px;
width:200px;
}

#box2a_text_whoweare {
top:513px;
left:544px;
width:200px;
}

#box2b_text_whoweare {
top:632px;
left:544px;
width:200px;
}

/* "Who We Are" Ends in Conditional*/

/* "Services" Begins in Conditional*/

#boxb_text1_services {
top:373px;
left:100px;
}

#boxb_text2_services {
top:410px;
left:115px;

}

#boxb_text3_services {
top:630px;
left:230px;
}

.style1 {
font-size:21px;
}
.style2 {
font-size:16px;
}
.style3{
font-size:16px;
}

/* "Services" Ends in Conditional*/

/* "Our Work" Begins in Conditional*/

#boxb_text1_ourwork {
top:373px;
left:100px;
}

#boxb_text2_ourwork {
top:410px;
left:115px;

}

#boxb_text3_ourwork {
top:630px;
left:230px;
}

.style1 {
font-size:21px;
}
.style2 {
font-size:16px;
}
.style3{
font-size:16px;
}

#holder {
height:733px;
}

/* "Our Work" Ends in Conditional*/

/* "Contact" Begins in Conditional*/

#boxb_text1_contact {
top:373px;
left:150px;
}

#boxb_text2_contact {
top:410px;
left:110px;

}

#boxb_text3_contact {
top:630px;
left:60px;
}

#boxb_text4_contact {
top:630px;
left:225px;
}

#boxb_text5_contact {
top:635px;
left:390px;
}

.style1 {
font-size:22px;
}
.style2 {
font-size:15px;
}
.style3{
font-size:12px;
}

.style4{
font-size:12px;
}

.style5{
font-size:12px;
}

/* "Contact" Ends in Conditional*/

[ristenk1]

css style sheet for all browsers:



#boxb_services {
position:absolute;
top:360px;
left:90px;
z-index:15;
}

#boxb_text1_services {
position:absolute;
top:353px;
left:130px;
font-size:18px;
color:#128f33;
z-index:16;
}

#boxb_text2_services {
position:absolute;
top:390px;
left:130px;
width: 625px;
font-size:16px;
color:#128f33;
z-index:17;
}

#boxb_text3_services {
position:absolute;
top:610px;
left:255px;
width: 385px;
font-size:18px;
color:#128f33;
z-index:18;
}

#twoleaves_services {
position:absolute;
top:557px;
left:397px;
z-index:19;
}


/* "Services" Ends */



/* "Our Work" Begins */


#boxb_ourwork {
position:absolute;
top:360px;
left:90px;
z-index:15;
}



#boxb_text1_ourwork {
position:absolute;
top:353px;
left:130px;
font-size:18px;
color:#128f33;
z-index:16;
}

#pic1 {
position:absolute;
top:427px;
left:161px;
z-index:17;
}

#pic2 {
position:absolute;
top:427px;
left:306px;
z-index:18;
}

#pic3 {
position:absolute;
top:427px;
left:451px;
z-index:19;
}

/* "Our Work" Ends */



/* "Contact" Begins */

#boxb_contact {
position:absolute;
top:360px;
left:90px;
z-index:15;
}

#boxb_text1_contact {
position:absolute;
top:353px;
left:150px;
font-size:18px;
color:#128f33;
z-index:16;
}

#boxb_text2_contact {
position:absolute;
top:390px;
left:110px;
width: 625px;
font-size:15px;
color:#128f33;
z-index:17;
}

#boxb_text3_contact {
position:absolute;
top:610px;
left:60px;
width: 385px;
font-size:14px;
color:#128f33;
z-index:18;
}


#boxb_text4_contact {
position:absolute;
top:610px;
left:225px;
width: 385px;
font-size:14px;
color:#128f33;
z-index:21;
}

#boxb_text5_contact {
position:absolute;
top:615px;
left:390px;
width:385px;
font-size:14px;
color:#128f33;
z-index:22;
}

#whitetree_contact {
position:absolute;
top:463px;
left:180px;
z-index:19;
}

#leaves2_contact {
position:absolute;
top:533px;
left:340px;
z-index:20;
}


/* "Contact" Ends */

[ristenk1]

Is there a way I can attach screen shots of the problem to show what it is I am talking about?

[dozzn]

Maybe you can save the screen shot as an image at your site, then insert it here

[ristenk1]

Good idea. Here it is: Looking for help

[Uncle Dog]

Now that I've visited the site...

Your html is invalid on all pages to one extent or another. You must sort this out before trying to ascertain why it doesn't work. As I've stated on a similar post, you are currently testing how various browsers display invalid html. They seldom agree 100% when it's valid.

Get yourself the Web Developer toolbar add-on for FireFox, you'll wonder how you managed without it.

[ristenk1]

ok, thanks

[ristenk1]

I validated it with W3C and it's still doing the same thing by changing the font size...any ideas?

Looking for help

[Uncle Dog]

I've managed to replicate the 'look' of your problem in FireFox.
I selected View > Zoom > Zoom text only and then zoomed in twice (Ctrl +)

Are you absolutely certain that the browser settings are correct?
Have you tried seeing how other sites appear on this browser?

[ristenk1]

It looks like you might have found the problem but that doesn't make sense because he doesn't have this problem with any other sites (I have seen other sites on this computer's browser and they looked normal). Is there something in the code that I can put to block the site from having the text zoomed?

[ristenk1]

Ok, I'm not completely convinced that it is exactly this because I can't get the exact look of the broken page with font-weight and the way it lines up like in the pictures but I do think that you were correct that it has to do with the text-zoom in the browser so my solution is going to be to suggest that they reset their browser (the simplest and best answer!) or I can redesign the page using pics of the words (therefore losing any SEO) so that their text-zoom doesn't break the page. Thank you so much Uncle Dog for all of your help!!

[Uncle Dog]

No problem. Please let me know how it works out.