make a button similar to the span in html
Question
I have a button like below with me.
<button type="submit" class="search-btn" id="search-submit-header"></button>
It has certain functionality which I want to apply to this span so that It does the same work as the button. I want to use the CSS of the span.
<span class="search-btn">
<a href="#"><i class="fa fa-search"></i></a>
</span>
How can I get this. ie Functionality of the button working on the span.
Apologies for a dumb question.
3 answers
solution1
1 2017-01-03 13:11:29
Simply put the style info to anchor tag. For Example check below line
<a href="#" class="search-btn">
<i class="fa fa-search"></i>
</a>
Note: Clear all the style information of anchor tag and write supporting javascript code
function doSomething(){
//your code
}
$('.search-btn').click(doSomething);
solution2
0 2017-01-03 13:12:50
Try something like this
<!DOCTYPE html> <html> <body> <style> .ButtonSpan { /*width: 500px; height: 500px;*/ border: 1px solid black; background: #e0e0e0; padding: 25px; } </style> <button type="submit" class="ButtonSpan">test</button> <span class="ButtonSpan">test</span> </body> </html>
solution3
0 2017-01-03 13:19:50
Find what
cssis currently applied on your<button>element.There are several ways to do it but the most simple one is (in chrome) you can right-click > inspect element > press "ctrl + shift + c" and click on button > elements tab > Computed tab (on RHS) and see what
cssis currently applied.Copy major properties of css from there and apply them on
span.search-btnclass in css.for example:
span.search-btn { width: 20px; height: 10px; border: 1px solid black; padding: 20px; }
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.