提交按钮不合作

我相信这是我的一个完整的监督，但我有一个按钮，我想一个输入框的直接权利，我的HTML是：提交按钮不合作

<input type="text" name="q" id="search" /> 
    <input type="submit" name="submit" id="submit" value="Go!" />

和css是：

#main input { 
     margin: 30px auto auto 130px ; 
     positiom: absolute; 
     font-size: 18px; 
     background: #fff; 
     border: 3px; 
     padding: 6px; 
     z-index: 3; 
     } 
    #search { 
     float: left; 
     width: 550px; 

    } 
    #submit { 
     width: 60px; 
    } 
    #submit::-moz-focus-inner { 
     border: 0; 
     padding: 0; 
    }

The Go！按钮直接位于提交框左侧的下方，任何类型的边距调整都是徒劳的，它只是停留在那里。还尝试使位置绝对和按钮重叠。

The Go！按钮将无法正确定位 - 它应该位于我的输入框的右侧，但它会挂在它下面。

我怎样才能让它直接定位到我的输入框？

感谢您的帮助！

编辑：

html{ 
    background: url(images/bg5.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
} 
#main{ 
    width: 875px; 
    height: 350px; 
    background: url(images/form3.png) 0 0 no-repeat; 
    margin:250px auto; 
    z-index: 1; 
    } 

#main form { 
    width: 850px; 
    height: 191px; 
    background: url(images/logo3.png) 0 0 no-repeat; 
    margin: -165px auto auto -90px; 
    position: absolute; 
    z-index: 2; 
    } 
#text { 
    font-size: 30px; 
    color: #ffffff; 
    font-family: parisjetaime; 
    margin: 189px auto auto 130px ; 
    line-height: 30px; 

} 
#main input { 
    margin: 30px auto auto 130px ; 

    font-size: 18px; 
    background: #fff; 
    border: 3px; 
    padding: 6px; 
    z-index: 3; 
} 
#search { 
    width: 550px; 
} 
#submit { 
     width: 60px; 
    float: right;  
} 
#submit::-moz-focus-inner { 
    border: 0; 
    padding: 0; 
}

来源

2011-04-06 Sapp

从描述中不清楚实际问题是什么。 – Oded 2011-04-06 21:23:25

抱歉 - 去！按钮将无法正确定位 - 它应该位于我的输入框的右侧，但它会挂在它下面。 – Sapp 2011-04-06 21:27:17

看起来你已经有了答案，但是请注意，你在#main输入下拼写错误的“位置” - 这可能不会帮助任何东西;） – kjl 2011-04-06 21:30:27

不知道这是你的问题，但似乎采取了从#submit转到margin: 130px auto auto 200px ;！按钮正确放置在搜索框的右侧。

演示： http://jsfiddle.net/3ykRD/

编辑

解决方案：http://jsfiddle.net/H3gYM/1/

的#main input性能进行了重写#submit特性 - 在这种情况下，利润率是什么让去！按钮被移动。放置!important取消覆盖，然后调整边距可解决问题。

来源

2011-04-06 21:27:33 quarkdown27

嗯，即使取出边距仍然使按钮保持在同一位置=/ – Sapp 2011-04-06 21:36:40

您还应该从#search中删除float：left。这将有助于使文本栏更好一些，我不确定是否真的需要它。 – 2011-04-06 21:40:55

hmm，仍然悬挂在输入栏下方 - 用我的其他风格编辑。 – Sapp 2011-04-06 21:46:07

为什么绝对放置您的输入？这是一个稍微修剪下来的代码，它们将使它们彼此相邻。该float:left是引起高度DIS-联合，因为它会导致两种元素不再是在同一个“行”

#main input { 
    font-size: 18px; 
    background: #fff; 
    border: 3px; 
    padding: 6px; 
    z-index: 3; 
    } 
#search { 
    width: 550px; 
} 
#submit { 
    width: 60px; 
} 
#submit::-moz-focus-inner { 
    border: 0; 
    padding: 0; 
}

来源

2011-04-06 21:35:49 smdrager

嗯，仍然挂在输入栏下方 - 用我的其余样式编辑。 – Sapp 2011-04-06 21:44:35

我想你想要的是恰到好处放置按钮，文本框，右侧？如果是这样你需要浮动输入按钮和文本框左侧;

#textbox { 
float: left; 
} 


#submit { 
    width: 60px; 
    float: left;

}

这总是为我工作:)让我知道它的工作！

来源

2011-04-06 22:15:48 Sisir

提交按钮不合作

回答

相关问题