使整個div可點擊（html）

我有以下問題！我有其中的文字超鏈接的按鈕（div）。我希望這個超鏈接可以在整個div上點擊。我得到這個做這個使整個div可點擊（html）

HTML工作：

echo '<div id="tagsul"><a href="' . get_category_link($category->term_id) . '"  style="color:#FFF;" title="' . sprintf(__("View all posts in %s"), $category->name) . '" ' . '>' . $category->name.'</a></div> ';

CSS：

#tagsul{ 
width:190px; 
height:40px; 
margin-right:5px; 
margin-left:5px; 
background:#82e1a1; 
text-align:center; 
float:left; 
margin-top:10px; 
} 

#tagsul a { 
display:block; 
height: 100%; 
width: 100%; 
text-decoration:none; 
}

這一切工作正常。但文本現在顯示在div的中間頂部。但我想它顯示在從兩個角度股利（高度和寬度）

我想我可以做一些與頂部填充的中間，但由於整個#tagsurl這不起作用是可點擊，所以當我在頂部使用填充會出現可點擊的按鈕下方的部分...

來源

2013-01-19 Merijn de Klerk

請記住在應用填充時編輯高度。它應該解決你的問題。

來源

2013-01-19 20:13:22 Quka

有幾個選項。您可以將div放入href標記中，並設置div的樣式，並且可以點擊，或者您可以使用onclick參數並使用JavaScript。

來源

2013-01-19 20:18:39

嗯使DIV可點擊的心不是很乾淨。除此之外，div風格不會在ie 7和更低版本中工作。即使您試圖設計它，div也會在其周圍獲得鏈接邊框。 –

然後只是樣式的鏈接。 –

或者使用無鏈接標記和我們的JavaScript來使其充當鏈接。 –

#tagsul{ 
width:190px; 
height:40px; 
margin-right:5px; 
margin-left:5px; 
background:#82e1a1; 
text-align:center; 
float:left; 
margin-top:10px; 
vertical-align: middle; 
display: table; 
} 

#tagsul a { 
display:block; 
height: 100%; 
width: 100%; 
text-decoration:none; 
vertical-align: middle; 
display: table-cell; 
}

Demo

來源

2013-01-19 20:19:08 MuhammadHani

顯示：塊然後顯示：table-cell？爲什麼？你爲什麼要添加2臺顯示器？ O_O – msqar

以下工作：

#tagsul { 
    width:190px; 
    height:100px; 
    margin-right:5px; 
    margin-left:5px; 
    background:#82e1a1; 
    text-align:center; 
    float:left; 
    margin-top:10px; 
    display: table; 
} 

#tagsul a { 
    text-decoration:none; 
    vertical-align: middle; 
    display: table-cell; 
}

來源

2013-01-19 20:21:49

使整個div可點擊（html）

回答

相關問題