Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ Line up HTML for AppStore Icon

Posted by: lb.fam May 24 2018, 04:14 PM

The HTML below shows the Apple App Store icon on the right lower than the Google Play icon.

How do I get them to display at the same level?

<!DOCTYPE html>
<html>
<head>
<title> </title>
</head>
<body>

<p><a href="https://play.google.com/store/apps/details?id=com.zumobi.msnbc" target="_blank" rel="noopener noreferrer"><img src="https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png" alt="Get it on Google Play" style="margin-top: 10px; width: 150px; height: 70px;" /></a>

<a href="https://itunes.apple.com/us/app/amazon-kindle/id302584613?mt=8" target="_blank" rel="noopener noreferrer" style="display: inline-block; overflow: hidden; background: url('https://linkmaker.itunes.apple.com/assets/shared/badges/en-us/appstore-lrg.svg') no-repeat; width: 135px; height: 40px; background-size: contain; margin-top: 10px;"></a></p>

</body>
</html>

Posted by: pandy May 25 2018, 08:16 AM

Easiest by downloading the Google Play image and cut off the broad white border in an image editor. Then upload it do your own server.

https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png

Posted by: pandy May 25 2018, 08:19 AM

Or even easier, use one that's more the size you want and without border.

https://play.google.com/intl/en_us/badges/