left align under 600 px

-1

我不太確定爲什麼我的Test site上的徽標在屏幕寬度小於600像素時仍保持對齊狀態？我沒有任何float left，我也用text-align: center來集中圖片。left align under 600 px

我正在構建電子郵件通訊模板。因此，我使用基礎的CSS框架，這意味着表。

任何人都可以看到爲什麼我的標誌左對齊低於600px？

HTML

<!-- Logo --> 
      <table class="row background-color__white"> 
      <tr> 
       <td class="center" align="center"> 
       <center> 
        <table class="container"> 
        <tr> 
         <td class="wrapper last"> 
         <table class="twelve columns"> 
          <tr> 
          <td style="text-align: center;"> 
           <a href="http://google.dk"> 
           <img width="250" height="80" src="https://s24.postimg.org/y6ho747xx/Untitled_1.png" alt="Alt text here"> 
           </a> 
          </td> 
          </tr> 
         </table> 
         </td> 
        </tr> 
        </table> 
       </center> 
       </td> 
      </tr> 
      </table>

來源

2017-01-31 McDuck4

1.請提供[MCVE。 2.不需要所有粗體文本。 –

我以前發佈過，其他人抱怨說我必須設置粗體文本，當時我寫道我正在編寫電子郵件。人們很生氣，我用桌子。所以從那時起我做了其他人說我應該做的事。現在我必須重新做同樣的事情。 – McDuck4

您是否在發佈代碼？ –

你的表，TR和TD標籤具有顯示：錶行，他們需要變成顯示：塊。如果您只需要它們進行媒體查詢，請將其粘貼在那裏。

#test, #test table, #test td, #test tr, #test tbody { 
    display: block; 
}

更新用的jsfiddle：

https://jsfiddle.net/cj09ecy2/

來源

2017-01-31 18:03:33 Keith

謝謝你的回答。這是否會影響我的代碼中的其他東西？ – McDuck4

啊好吧，只是試過。所以整個網站左對齊:) – McDuck4

是的，它會影響每個表，tr和td標籤。如果您只希望它在徽標所在的位置生效，請使用.row類。所以.row td，.row tr，或者只是在表格的開頭使用一個ID並且這樣做 – Keith

在Zurb，低於600意味着媒體查詢設置你的細胞被align = 「left」。這意味着href，td，tr或table在你的表格單元格上放置一個align =「left」。

通過將相同的中心樣式放置在td上方的每個父元素上，您可以強制徽標對齊中心。

<table align="center" cellspacing="0" cellpadding="0" border="0" width="100%" class="twelve columns" style="text-align: center;"> 
    <tr style="text-align: center;"> 
    <td style="text-align: center;"> 
     <a href="http://google.dk"> 
     <img width="250" height="80" src="https://s24.postimg.org/y6ho747xx/Untitled_1.png" alt="Alt text here"> 
    </td> 
    </tr> 
</table>

您還可以添加一個類像.center-align {text-align: center !important;}並添加到您的TD類以及媒體查詢下600

來源

2017-01-31 18:15:09 gwally

非常感謝你的回答。聽起來你對Zurb有很多知識。我剛剛嘗試了你說的話，但對不起圖片仍然不斷跳到左側：http://vouzalis.com/public-1.html – McDuck4

在線326上，複製table.body並創建此標記： 'table .body {\ ttfont \ text \ align：center！important; }' 將它留在第326行的下面，這樣它就會被最後讀取。 – gwally

這裏有一些錯誤。我做了你寫的東西，但它仍然是一樣的。 http://vouzalis.com/public-1.html。我不知道這個了 – McDuck4

left align under 600 px

回答

相關問題