Question

有联系表格，我有一些选项可以检查联系时间和方法。我在Chrome，Firefox和Safari上正确设置了样式。无线电选项左侧的标签，它们都排成一行。

我遇到了Chrome风格已经崩溃的问题，我无法弄清楚Firefox和Safari CSS是如何完美运行的。该页面为cbasphaltmaintenance.com

    <table id="contactOptionTable">
            <tr>
                <td>
                <h1>Prefered contact method:</h1>
                </td>    
                <td>
                <input type="radio" value="home" name="contact_Method" class="contactRadioClass"/>
                <label for="home">Home</label>
                </td>
                <td>
                <input type="radio" value="mobile" name="contact_Method" class="contactRadioClass" />
                <label for="home">Mobile</label>
                </td>
                <td>
                <input type="radio" value="email" name="contact_Method" class="contactRadioClass" />
                <label for="home">Email</label>
                </td>
            </tr>
            <tr>
                <td>
                <h1>Prefered contact time:</h1>
                </td>    
                <td>
                <input type="radio" value="morning" name="contact_Time" class="contactRadioClass"/>
                <label for="home">Morning</label>
                </td>
                <td>
                <input type="radio" value="afternoon" name="contact_Time" class="contactRadioClass" />
                <label for="home">Afternoon</label>
                </td>
                <td>
                <input type="radio" value="night" name="contact_Time" class="contactRadioClass" />
                <label for="home">Evening</label>
                </td>
            </tr>
            </table>

这是在safari和firefox中运行的css

    #contactOptionTable{
vertical-align: middle;
float: left;
padding: 0;
margin-left: 14%;
 }

    .contactRadioClass{
    margin-top:10px;
    }

我不知道这里发生了什么，但这让我烦恼。我感谢所有的帮助。你可能会看到我的耳后有点湿。

Answer 1

您需要缩小margin-left: 5%并将width : 100%添加到#contactOptionTable。

但是我建议你不要在这里使用表格结构，如果你使用div's

创建它会更好

Answer 2

在CSS中添加以下类。

#contactOptionTable input
{
  float:right;
}

表格样式在Chrome中不同

2 个答案: