surajt Posted June 28, 2019 Share Posted June 28, 2019 (edited) 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 June 28, 2019 by surajt Link to comment Share on other sites More sharing options...
JMRKER Posted July 2, 2019 Share Posted July 2, 2019 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> Link to comment Share on other sites More sharing options...
shaili_shah Posted December 6, 2019 Share Posted December 6, 2019 you can use css float property to achieve image side by side refer this: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_images_side_by_side Link to comment Share on other sites More sharing options...
ishan_shah Posted December 27, 2019 Share Posted December 27, 2019 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. Link to comment Share on other sites More sharing options...
JMRKER Posted December 28, 2019 Share Posted December 28, 2019 On 12/5/2019 at 10:40 PM, shaili_shah said: you can use css float property to achieve image side by side refer this: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_images_side_by_side Which, if you looked at the code, is exactly what I suggested. Link to comment Share on other sites More sharing options...
JMRKER Posted December 28, 2019 Share Posted December 28, 2019 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. Link to comment Share on other sites More sharing options...
dsonesuk Posted December 28, 2019 Share Posted December 28, 2019 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. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now