爲什麼我的@media不再工作？

我在CSS上有幾個媒體查詢。他們前幾天的工作很完美，但我剛剛注意到他們都沒有做任何事情。 Here they are上下文（末），這是我的代碼：爲什麼我的@media不再工作？

/* MOBILE OPTIMISATION */ 

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) { 

    body { 
     width: 89%; 
     margin: 0; 
    } 

    .post-entry { 
     width: 100%; 
    } 

    .widgets { 
     display: none; 
    } 

    p.frontpage_jobs { 
     width: 100%; 
     float: none; 
    } 

    #blog-wrap { 
     width: 100%; 
    } 

    .post-entry header h1 { 
     font-size: 1.5em; 
    } 

} 


/* TABLET OPTIMISATION */ 

@media screen and (max-width: 800px) { 

body { 
    width: 89%; 
    //float: none; 
    margin: 0; 
} 

.post-entry { 
    width: 100%; 
} 

.widgets { 
    display: none; 
} 

p.frontpage_jobs { 
    width: 100%; 
    float: none; 
} 

#blog-wrap { 
    width: 100%; 
} 

.post-entry header h1 { 
    font-size: 1.5em; 
} 
} 

@media screen and (max-width: 1200px) { 

#main-content { 
    width: 1200px; 
} 

.widgets { 
    display: none; 
} 

}

編輯

我的網站是here。

來源

2014-03-01 Sebastian

您是否擁有支持移動設備的正確元視圖？ – chadpeppers

我不知道，但我正在使用移動就緒的Thinking WP主題的修改版本（http://www.wpexplorer.com/thoughts-wordpress-theme/），並且我已成功設法優化移動之前 - 它以某種方式恢復或不適用。我認爲我做了另一個改變它的改變。 – Sebastian

確保你的 – chadpeppers

您的媒體查詢似乎正在工作。看起來你有溢出問題。刪除「width：850px;」 .post-entry，爲＃main-content和body-padding設置的寬度以及「width：98％;」爲我解決了客戶端的問題。

也就是說，如果它是一個流體調整大小，你正在尋找。

來源

2014-03-01 20:03:54

完美的作品。我忘記了自從用.post-entry和#main-content寬度來修改它們之後，我就開始了。謝謝！ – Sebastian

快樂我可以幫忙。玩得開心編碼！ :) –

爲什麼我的@media不再工作？

回答

相關問題