表格在中間

Question

我需要在頁面中間有表格，但是我的表格的內容像圖片一樣在右側。

[編輯]：對不起，我忘了說只是響應tabke被搞砸了，你可以看看它edastehlik.wz.cz視：500 - 1050

但我需要有這樣的：

.tabulkaodesilac { 
 
    width: 100%; 
 
    margin-left: 400px; 
 
    display: block; 
 
} 
 

 
#jmeno, 
 
#e-mail, 
 
#spam, 
 
#predmet { 
 
    border-radius: 50px; 
 
    background: rgba(141, 109, 182, 0.75); 
 
    width: 350px; 
 
    height: 25px; 
 
    font-family: Calibri; 
 
    font-size: 16px; 
 
    color: white; 
 
    padding: 0 10px; 
 
    border-style: none; 
 
} 
 

 
@media screen and (max-width: 1050px) { 
 
    .tabulkaodesilac { 
 
    padding: 0px; 
 
    margin-bottom: 10px; 
 
    position: relative; 
 
    width: 100%; 
 
    margin: 0 auto; 
 
    } 
 
    #jmeno, 
 
    #e-mail, 
 
    #spam, 
 
    #predmet { 
 
    width: 70%; 
 
    font-family: verdana; 
 
    margin-left: 10px; 
 
    display: block; 
 
    margin: 0 auto; 
 
    } 
 
}

<table class="tabulkaodesilac"> 
 
    <tr> 
 
    <td><input id="jmeno" type="text" name="jmeno" placeholder="Vaše Jméno" /> <br></td> 
 
    <td><input id="e-mail" type="email" name="email" placeholder="Váš E-mail" /><br></td> 
 
    </tr> 
 
    <tr> 
 
    <td><input id="spam" type="text" name="spam" placeholder="Zadejte aktuální rok" /><br></td> 
 
    <td><input id="predmet" type="text" name="predmet" placeholder="Předmět" /> <br></td> 
 
    </tr> 
 
</table>

Answer 1

表有margin-left: 400px;和display: block; - 尤其是display: block;實際上防止其表（表中必須有display: table） - 所以只是抹去這一點（也即過大的餘量），它會工作：

.tabulkaodesilac { 
 
    width: 100%; 
 
} 
 

 
#jmeno, 
 
#e-mail, 
 
#spam, 
 
#predmet { 
 
    border-radius: 50px; 
 
    background: rgba(141, 109, 182, 0.75); 
 
    width: 350px; 
 
    height: 25px; 
 
    font-family: Calibri; 
 
    font-size: 16px; 
 
    color: white; 
 
    padding: 0 10px; 
 
    border-style: none; 
 
} 
 

 
@media screen and (max-width: 1050px) { 
 
    .tabulkaodesilac { 
 
    padding: 0px; 
 
    margin-bottom: 10px; 
 
    position: relative; 
 
    width: 100%; 
 
    margin: 0 auto; 
 
    } 
 
    #jmeno, 
 
    #e-mail, 
 
    #spam, 
 
    #predmet { 
 
    width: 70%; 
 
    font-family: verdana; 
 
    margin-left: 10px; 
 
    display: block; 
 
    margin: 0 auto; 
 
    } 
 
}

<table class="tabulkaodesilac"> 
 
    <tr> 
 
    <td><input id="jmeno" type="text" name="jmeno" placeholder="Vaše Jméno" /> <br></td> 
 
    <td><input id="e-mail" type="email" name="email" placeholder="Váš E-mail" /><br></td> 
 
    </tr> 
 
    <tr> 
 
    <td><input id="spam" type="text" name="spam" placeholder="Zadejte aktuální rok" /><br></td> 
 
    <td><input id="predmet" type="text" name="predmet" placeholder="Předmět" /> <br></td> 
 
    </tr> 
 
</table>

Answer 2

您可以指定margin: 0 auto爲你的餐桌，並從那裏除去其他的東西：

.tabulkaodesilac { 
 
    margin: 0 auto; 
 
} 
 

 
#jmeno, 
 
#e-mail, 
 
#spam, 
 
#predmet { 
 
    border-radius: 50px; 
 
    background: rgba(141, 109, 182, 0.75); 
 
    width: 350px; 
 
    height: 25px; 
 
    font-family: Calibri; 
 
    font-size: 16px; 
 
    color: white; 
 
    padding: 0 10px; 
 
    border-style: none; 
 
} 
 

 
@media screen and (max-width: 1050px) { 
 
    .tabulkaodesilac { 
 
    padding: 0px; 
 
    margin-bottom: 10px; 
 
    position: relative; 
 
    width: 100%; 
 
    margin: 0 auto; 
 
    } 
 
    #jmeno, 
 
    #e-mail, 
 
    #spam, 
 
    #predmet { 
 
    width: 70%; 
 
    font-family: verdana; 
 
    margin-left: 10px; 
 
    display: block; 
 
    margin: 0 auto; 
 
    } 
 
}

<table class="tabulkaodesilac"> 
 
    <tr> 
 
    <td><input id="jmeno" type="text" name="jmeno" placeholder="Vaše Jméno" /> <br></td> 
 
    <td><input id="e-mail" type="email" name="email" placeholder="Váš E-mail" /><br></td> 
 
    </tr> 
 
    <tr> 
 
    <td><input id="spam" type="text" name="spam" placeholder="Zadejte aktuální rok" /><br></td> 
 
    <td><input id="predmet" type="text" name="predmet" placeholder="Předmět" /> <br></td> 
 
    </tr> 
 
</table>