Jump to content
Galaxyweaver

•Adding A Link Into A CSS Button

Recommended Posts

• Greetings

 

I am attempting to Link page to a current button I have built. Please assist me! +500 Karma points!

 

Page to Link -- http://www.summitsealantsutah.com/home.html

 

Current Button Code --

<!DOCTYPE html>

<html>
<head>
<style type="text/css">
.classname {
-moz-box-shadow: -14px -39px 0px -50px #a11ea1;
-webkit-box-shadow: -14px -39px 0px -50px #a11ea1;
box-shadow: -14px -39px 0px -50px #a11ea1;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #707070) );
background:-moz-linear-gradient( center top, #ffffff 5%, #707070 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#707070');
background-color:#ffffff;
-webkit-border-top-left-radius:15px;
-moz-border-radius-topleft:15px;
border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
-moz-border-radius-topright:15px;
border-top-right-radius:15px;
-webkit-border-bottom-right-radius:15px;
-moz-border-radius-bottomright:15px;
border-bottom-right-radius:15px;
-webkit-border-bottom-left-radius:15px;
-moz-border-radius-bottomleft:15px;
border-bottom-left-radius:15px;
text-indent:0px;
border:8px solid #dbdbdb;
display:inline-block;
color:#000000;
font-family:arial;
font-size:26px;
font-weight:bold;
font-style:italic;
height:48px;
line-height:48px;
width:124px;
text-decoration:none;
text-align:center;
text-shadow:0px 5px 3px #4d4d4d;
}
.classname:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #707070), color-stop(1, #ffffff) );
background:-moz-linear-gradient( center top, #707070 5%, #ffffff 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#707070', endColorstr='#ffffff');
background-color:#707070;
}.classname:active {
position:relative;
top:1px;
}
</style>
</head></html>

Share this post


Link to post
Share on other sites

You don't add this css code under every button link you add it between <head></head> OR in external style sheet which you link to again! between <head></head> only.

  • Like 1

Share this post


Link to post
Share on other sites

Thank you very much for you super fast response!

 

I am soo rusty. Long story short is I somehow made it out of a life of terrible choices and now I am attempting to mold my future...

That be said I am pretty much learning all over again....

 

So I added <head><a href="url">http://www.summitsealantsutah.com/home.html</a></head> just below the style tag above but it doesn't look right. Or Work haha.

The builder I use has a Drag and Drop HTML section. So I was attempting to create said drag and drop per each button and hoping to have a link to each page for each button.

 

I don't recall how to create external style sheets properly and my host has very limited storage space for now x(

 

Could you possibly throw in the code that might work for me to try?

 

Thank you so much!

Share this post


Link to post
Share on other sites

For real Dave. That is all I do now with my time is study and learn. Thanks for lookin out! Please please feel free to critique anything.

Share this post


Link to post
Share on other sites
<!DOCTYPE html><html><head><!-- css code within <style></style> or link to external style sheet go here --></head><body><!-- html code that make up webpage goes here --></body></html>
All what you see here must be singular within the webpage, no multiple head, body, html (made up for example opening <html> and closing </html> tags), exactly as laid out here. Edited by dsonesuk
  • Like 1

Share this post


Link to post
Share on other sites

Thank you again kind sir!

 

With your help today I learned so much.

 

Please please check out the site I built... www.Summitsealantsutah.com

 

I would very much appreciate ANY positive or negative feed back.

 

 

Thank you have a great week everyone!

Edited by Galaxyweaver

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...