html - 边距不占用较小的屏幕

Question

我正在尝试为 iphone 屏幕的文本字段提供边距......但我无法做到......我通过创建一个 id 来提供媒体查询......它采用边框颜色但是它不是在谈论边距属性......在下面提供我的代码......当你缩小浏览器窗口时，你可以找到它......

http://jsfiddle.net/rajkumart08/U4ygP/1/我已经整理了代码......并且代码在第 4507 行中找到

@media(max-width:768px)
{
.page-content
{
    background:transparent
}
.page-content .page
{
    margin-top:40px
}


#nameForm{ border: 1px solid red;  margin-right: 12px; width: 354px;}
#inquiryForm{ border: 1px solid red; margin-right: 12px;  width: 354px;}

Answer 1

看起来您的媒体查询需要调整：

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

    } 

我添加了

#nameForm {
        -moz-box-sizing: border-box;
        margin-left: 12px;
        min-height: 30px;
        width: 364px;
        border: 1px solid red;
    }
    #inquiryForm {
        border: 1px solid red;
        margin-right: 12px;
        width: 364px;
        -moz-box-sizing: border-box;
        margin-left: 12px;
    }