3

I have this nice line of HTML and equaling lines of CSS which give me a nice looking button.

the HTML code is

<button class="button"> <i class="fa fa-twitter"></i></button>

and the corresponding CSS is 

#button { 
font-size: 44px; 
color: rgb(255, 255, 255); 
background: rgb(0, 0, 0) none repeat scroll 0% 0%; 
width: 64px; 
height: 58px; 
border-radius: 13px; 
border-style: none;}

Could anyone explain to me how I can turn this into a clickable link, which will lead to my twitter, or github, or whichever page I'd like that button linked to. Im about 9 days into learning HTML and CSS so any help is much appreciated :D

***Just want to state that i didn't fully understand how to implement the code that was used in the question that this one is similar too, i apologize for creating a duplicate question. Very new to coding and was hoping to get specified help, which i did. So thanks everyone =)****

Tammerg
  • 111
  • 2
  • 2
  • 12

3 Answers3

0

You just need to add an onclick action: 

<button class="button" onclick='location.href="http://twitter.com"'>
    <i class="fa fa-twitter"></i>
</button>
kojow7
  • 10,308
  • 17
  • 80
  • 135
0
.button { 
font-size: 44px; 
color: rgb(255, 255, 255); 
background: rgb(0, 0, 0) none repeat scroll 0% 0%; 
width: 64px; 
height: 58px; 
border-radius: 13px; 
border-style: none;
} 

<button class="button" onclick='location.href=""'>
    <i class="fa fa-twitter"></i>
</button>

you are using #id in css.but your html code you ussing .class..this create a problm.please remove the id and try to class..

try thiss code..Thanks

Abhishek Mahajan
  • 28
  • 5
0

<button class="button" onclick="document.location.href='DemoPage.html'"> <i class="fa fa-twitter"></i></button>
Hamza _Mehmood
  • 1
  • 1