HTML和CSS居中

Question

我正在嘗試將搜索欄居中在我的網頁上。我目前使用以下代碼將HTML中心放置在HTML中：

<div class="search" > 
    <form action="search" align="center"> 
    <input type = "text" name= "search" placeholder= "THIS DOESNT WORK..."/> 
    <input type = "submit" value ="Search"/><a href="Browse.html" id="browse">Browse</a> 
    </form> 
</div> 

但是，當樣式位於HTML中時，我無法驗證我的頁面。

我的問題是，我無法弄清楚如何將搜索欄放在CSS中間。

我一直在尋找到它，它是我的理解，這應該工作：

#search{ 
width:400; 
margin-left: auto; 
    margin-right: auto; 

} 

然而，這是行不通的。

我對此很新，很抱歉，如果這是非常基本的。

Answer 1

由於此代碼似乎在JSFiddle中工作，我的建議是，您可以確定包含<div class='search'></div>的父元素足夠寬以容納400px居中元素。嘗試設置其父寬度爲100％，看看是否有效。

無父：http://jsfiddle.net/kj9AD

與父：http://jsfiddle.net/kj9AD/1/

Answer 2

你應該把一個寬度100％.search和文本形式

http://jsfiddle.net/UTrSU/

.search{ 
width:100%; 
} 
form {text-align:center;} 

對齊當你有一個div類你應該把「.name」和什麼時候是一個div id你應該把「#name」

Answer 3

Class -> . 

這就是區別

ID -> # 

如果你有class="search"的元素，在您使用.search{/* style here */} CSS，但如果你有id="search"的元素，在CSS你必須使用#search{/* style here */}

在你的代碼中，你有class="search"，在CSS中你有#search{}

所以，這將工作：

<div class="search" > 
    <form action="search"> 
    <input type = "text" name= "search" placeholder= "THIS DOESNT WORK..."/> 
    <input type = "submit" value ="Search"/><a href="Browse.html" id="browse">Browse</a> 
    </form> 
</div> 
<style> 
    .search{ 
    width:400; 
    margin-left: auto; 
     margin-right: auto; 
    } 
</style> 

http://www.w3schools.com/css/css_id_class.asp