每個瀏覽器都有奇怪的大小調整，除了IE瀏覽器

我一直在編寫我的網站，它在IE 8中看起來很完美，但是當我在Safafi，Chrome和Firefox中查看它時。一切都無法小覷。 如何使網頁看起來像在IE 8瀏覽器中一樣正常？每個瀏覽器都有奇怪的大小調整，除了IE瀏覽器

我的網站是：http://www.jjosephs.byethost22.com/visibility/fixed/index_2.htm

我一直在用他的代碼搞亂了好幾天，現在試圖讓它在所有4個瀏覽器。我粘貼了下面的CSS代碼，也許有些東西會跳出你的CSS大師。


/* Eric Myers - CSS Reset v1.0 | 20080212 */ 

html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, font, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    outline: 0; 
    vertical-align: baseline; 
    background: transparent; 
} 
body { 

    background-color: rgb(85,105,94); 
    font-family:"Gill Sans MT", "Gill Sans", sans-serif; 
    color:white; 
} 
ol, ul { 
    list-style: none; 
} 
blockquote, q { 
    quotes: none; 
} 

/* remember to define focus styles! */ 
:focus { 
    outline: 0; 
} 

/* remember to highlight inserts somehow! */ 
ins { 
    text-decoration: none; 
} 
del { 
    text-decoration: line-through; 
} 

/* tables still need 'cellspacing="0"' in the markup */ 
table { 
    border-collapse: collapse; 
    border-spacing: 0; 
} 

/* 
     Created by Keith Donegan of Code-Sucks.com 

     E-Mail: [email protected] 

     You can do whatever you want with these layouts, 
     but it would be greatly appreciated if you gave a link 
     back to http://www.code-sucks.com 

*/ 

* { padding: 0; margin: 0; } 

#wrapper { 
margin: 0 auto; 
width: 922px; 
} 

#leftcolumn { 
margin: 10px 0px 0px 0px; 
padding: 10px; 
height: 500px; 
width: 155px; 
float: left; 
} 
#content { 
float: left; 
margin: 10px 0px 0px 0px; 
padding: 10px; 
height: 500px; 
width: 490px; 
display: inline; 
line-height:110%; 
font-family:"Gill Sans MT", "Gill Sans", sans-serif; 
} 
#rightcolumn { 
margin: 10px 0px 0px 0px; 
padding: 10px; 
height: 500px; 
width: 155px; 
float: left; 
position: relative; 
} 


#background_gradient img{ 
    position:absolute; 
    width:100%; 
    left:0px; 
    top:0px; 
} 

#background_logo img{ 
    position:absolute; 
    left:-271px; 
    top:-134px; 
    z-index:-1; 
    display:inline; 
} 

#coming_soon_img{ 
    position:absolute; 
    top:0px; 
    left:0px; 
} 

#logo_large{ 
    float:right; 
} 

#landing_text{ 
    clear:both; 
} 

#first_paragraph, #company_name, #street_address, .contact_short, #copyright{ 
    color:#ffffff; 
} 

#landing_text{ 
    font-size:15px; 
    line-height:20px; 
} 

.colored_text{ 
    color:#bd9e00; 
} 

#first_paragraph{ 
    font-size:20.5px; 
    font-weight:bold; 
} 

#first_paragraph span{ 
    font-weight:normal; 
    font-style:italic; 
} 

#lower_half{ 
    margin-top:26px; 
} 

#tag_line{ 
    font-size:17px; 
    float:left; 
} 


#call_to_action_button{ 
    float:right; 
} 

#company_name{ 
    font-size:13.5px; 
} 

#horizontal_line{ 
    margin-top:15px; 
} 

#footer_text{ 
    font-size:7.5px; 
    font-family:arial, "Gill Sans MT", sans-serif; 
    font-weight:bold; 
} 

#logo_micro, #address_details{ 
    float:left; 
} 

#address_details{ 
    margin-left:12.5px; 
} 

#contact_details{ 
    display:block; 
    line-height:80%; 
} 

.specific_contact_details, .specific_contact_details a{ 
    color:#bd9e00; 
} 

#copyright{ 
    float:right; 
    font-size:6.5px; 
} 
.other_landing_text{ 
    line-height:121.5%; 
    color:#313031; 
}

來源

2010-06-22 Julian

我敢肯定，其他人會聽到，但作爲一個附註，不推薦使用'px'來設置字體大小。 – scunliffe 2010-06-22 01:15:16

你太擔心了。您可以控制基本佈局和樣式，而不是確切的字體或大小。這就是說，我沒有看到FF和IE的區別。 – 2010-06-22 01:17:41

確保它不喜歡的東西，因爲font-size:7.5px;應該是非常小的你是放大在IE8。

來源

2010-06-22 01:18:17

是的，我放大了IE瀏覽器： - /。在所有3種瀏覽器中都具有相同的打印效果，因此我至少具有跨瀏覽器兼容性。以一定的比例增加一切，看看我是否能找到一個不會讓我的用戶失明的頁面。 – Julian 2010-06-22 01:26:26

@Julian：不要忘記標記這是正確的答案。 – 2010-06-22 01:29:12

在IE7，Chrome，Safari，FF中看起來不錯，除了透明的.png圖片在IE6中不起作用。不錯的工作！

來源

2010-06-22 01:26:01 JohnB

每個瀏覽器都有奇怪的大小調整，除了IE瀏覽器

回答

相關問題