JSFiddle - React, Tailwind, and code Playground

HTML

<div id="links-block">			
                <a href="http://www.google.com"><div id="edit-quote-button"></div></a>
				<a href="http://www.yahoo.com" id="preview-pdf-link">Preview the PDF</a>
			</div>


The red area is supposed be just a container, without linking to "www.google.com"

CSS

#links-block {
width: 400px;
background-color:red;
}
#edit-quote-button {
background-image: url('http://www.emoceanstudios.com.au/quote/images/Edit-Quote-Bttn.gif') !important;
background-repeat: no-repeat;
width: 166px;
height: 44px;
}
#edit-quote-button:hover {
background-position: 0 -44px;
}
#preview-pdf-link {
float: right;
color: #999999;
}

a{display:inline-block;vertical-align: top;}