Jump to content
surajt

How to place two images parallel to each other?

Recommended Posts

i have a piece of code - <a href="https://goo.gl/2qQsCf"><img src="/wp-content/uploads/2019/06/car-wreckers-review.png"></a><a href="tel:00000000"><img src="/wp-content/uploads/2016/08/call-1.png" alt="Call: 00000000" onClick="goog_report_conversion('tel:00000000')"></a>

I want to align them horizontally right now both images align up and down. I want it to be side by side.

Please if someone can help with the code.

Thanks

Edited by surajt

Share this post


Link to post
Share on other sites

I don't have access to your images so I just chose an arbitrary size.  Modify as needed.

	<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
	<meta name="viewport" content="width-device-width,initial-scale=1.0, user-scalable=yes"/>
	<title> HTML5 Test Page </title>
<!-- link rel="stylesheet" href="common.css" media="screen" -->
<style>
 div { border: 1px solid black; height: 100px; width: 200px; float: left; }
</style>
	</head>
<body>
	<div>
 <a href="https://goo.gl/2qQsCf">
  <img src="/wp-content/uploads/2019/06/car-wreckers-review.png" alt="Call: ???"></a>
</div>
	<div>
<a href="tel:00000000">
  <img src="/wp-content/uploads/2016/08/call-1.png" alt="Call: 00000000" onClick="goog_report_conversion('tel:00000000')"></a>
</div>
	</body>
	</html>

 

Share this post


Link to post
Share on other sites

Hello @surajt,
You can simply use the table. You can place both the images into two columns. This could be the easiest solution. Although you can set its height and width in such a manner that it could place horizontally in the same line. As <img> is an inline element.

Share this post


Link to post
Share on other sites
On 12/27/2019 at 12:05 AM, ishan_shah said:

Hello @surajt,
You can simply use the table. You can place both the images into two columns. This could be the easiest solution. Although you can set its height and width in such a manner that it could place horizontally in the same line. As <img> is an inline element.

Table would not automatically reformat to vertical display as in suggested code,
but would be clipped and lost if the images are too large for the screen.

 

Share this post


Link to post
Share on other sites

They are the plagiarism couple, haven't come with solution between them without copying someone else's previous solution here on the forum or somewhere else on the web with sometimes coming up with the most impractical solution as observed.

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...