單擊全部按鈕時出現問題。 CSS按鈕

Probem
我有一個CSS按鈕，只能在測試區域點擊。我無法點擊按鈕的非文本區域。單擊全部按鈕時出現問題。 CSS按鈕

這裏是我的網站上的「編輯」按鈕的HTML代碼。

<div class="stndrd_btn"> 
    <p><?php echo $html->link('Edit','... destination....'); ?></p> 
</div>

下面是該按鈕的CSS代碼。

.stndrd_btn { 
    width:140px; 
    height:30px; 
    background:url(img/stndrd_btn.png); 
    color:#FFF; 
    cursor: pointer; 

} 

.stndrd_btn p { 
    color:#FFF; 
    margin:0 auto; 
    text-align:center; 
    vertical-align: middle; 
    padding-top:6px; 
    font-size:14px; 
    font-weight: bold; 
    width: 100%; 
    height: 100%; 
    display: block; 
    cursor:pointer; 
}

請讓我知道我如何使點擊工作遍佈按鈕。謝謝！！

來源

2010-06-30 vamosrafa

在Chrome上正常工作。你有什麼瀏覽器遇到問題？ – tcooc 2010-06-30 19:23:12

製作<a>標記display: block並給它一個寬度和高度，以便該按鈕完全由<a>元素組成。

<a href="http://www.google.com" style="display: block; width: 300px; height: 200px; background: gold;">Go to Google</a>

或者，你可以給它一個邊框，使文本在按鈕的中間：

<a href="http://www.google.com" style="display: block; width: 300px; border: solid gold 100px; background: gold;">Go to Google</a>

來源

2010-06-30 07:01:39 Sjoerd

我不會推薦內聯風格 – matpol 2010-06-30 07:14:51

這是一個例子。 – Sjoerd 2010-06-30 07:15:59

我認爲問題是，p標籤是div內，但你申請背景圖片爲div，但鏈接爲p。 p也有填充。

所以簡而言之，請嘗試在一個標籤中完成所有操作。

編輯：像@Sjoerd說：使用a標記。

來源

2010-06-30 07:03:36

你並不真的需要p標籤。將所有內容應用於div，我認爲你應該沒問題。我真的會將點擊應用到一個href，儘管如此，如果沒有JS或搜索引擎的人也可以有一個回退。

<div class="stndrd_btn"> 
    <a href="#"><?php echo $html->link('Edit','... destination....'); ?></a> 
</div>

在這種情況下，將按鈕屬性應用到標籤。

來源

2010-06-30 07:04:44 matpol

使<一個> 作爲顯示：塊並給它填充作爲像

填充：5px的5像素5像素爲5px;

這將增加一個鏈接

來源

2010-06-30 07:09:06 ZX12R

嘗試的點擊區域只能用「A HREF」標籤，然後添加填充和背景它。 padding：5px 5px;背景：灰色;這看起來像一個按鈕，可點擊。

來源

2010-06-30 21:06:13 Gil

單擊全部按鈕時出現問題。 CSS按鈕

回答

相關問題