使用css

Question

我正在设计。设计位于链接

http://jodbaki.com/apply-now。

在它的桌面版本工作正常，但何时。我在手机中看到它，然后表格从右侧出来。我怎样才能调整它？

Answer 1

您

<tbody style="float:right; background:white; margin:12px; width:285px;">

应该是一个班级。如果在移动设备上显示，则该元素根本不会更改。如果您将它作为一个类（具有任何名称，可能是.applyform），那么您可以更改桌面版和移动版的CSS。

桌面版，您可以复制上面的tbody样式并使其成为一个类。对于移动版本，我建议只更改浮动：

.applyform { float:none; margin:0; }

没有浮动，你的表格将是100％宽度。

Answer 2

这是因为您的input，textarea和select。尝试在宽度小于400px时添加CSS媒体查询，将所有字段从150px缩小到100px。

@media screen and (max-width: 400px) {    
  input,textarea,select {
      width: 100px !important;
  }    
}