Anushka Reddy Anushka Reddy - 5 months ago 20
Javascript Question

How can i add hover button to the link

This is my blog as you can see FUll Details link in the post so i want to change that to button

The below is my code I want to add hover button like this



.readmorecontent a {
color: #008800;
float: center;

}

<span class="readmorecontent"><a href="http://urstrulyvijay.blogspot.in/2016/06/green-apple-is-best-fruit-to-eat-in-all.html">Full Details→</a></span>





This is my actual code in theme or template

<span class='readmorecontent'><a expr:href='data:post.url'>Full Details&#8594;</a></span>

.readmorecontent a {
color: #008800;
float: center;

}

Answer

You could copy the codes from the link you have posted in your question.. So you could do something like this:

.readmorecontent a {
    color: #008800;
    float: center; /* Error on this line */
    border: 2px solid #4CAF50;
    color: #008800;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}
.readmorecontent a:hover {
    background-color: #4CAF50;
    color: white;
}
<span class="readmorecontent"><a href="http://urstrulyvijay.blogspot.in/2016/06/green-apple-is-best-fruit-to-eat-in-all.html">Full Details→</a></span>

Note: float: center; doesn't exists. Maybe you are looking for margin: 0px auto;?

I hope this will help you.