简体   繁体   中英

HTML won't display 2 images

I want to display 2 images on the same row like this:

Image  Same Text  Image

If I put one image it works, but if I put both of them I get 404. I think I am doing something wrong in the code I don't have much experience with HTML and don't know what I am missing. The files are in same folder. Here is the code:

<td colspan="8" >
<h1>
<img src="/home/apps/myapp/dynamic/img/myimage1.png" style="float:left; " alt="This is my mage" height="130" width="455">
<b>Same text</b>
<img src="/home/apps/myapp/dynamic/img/myimage2.png" style="float:right; vertical-align:middle;" alt="My second image" height="130" width="454"></h1>
</td>

simply you can use bootstrap.. divide the page into 2 halves using col-md-6 and put your data in its individual divs

   <div class="container">
    <div class="row">
     <div class="col-md-6">
      <img src="/path1">
     </div>
    <div class="col-md-6">
     <img src="/path2">
    </div>
   </div>
  </div>

There is an extra start tag in your code, which is giving the error.

The Problem:

<<img src="/home/apps/myapp/dynamic/img/myimage2.png" 
style="float:right; vertical-align:middle;" alt="My second image" 
height="130" width="454"></h1>

The Solution

<img src="/home/apps/myapp/dynamic/img/myimage2.png" 
style="float:right; vertical-align:middle;" alt="My second image" 
height="130" width="454"></h1>

You can do by creating a nested table.

<td>
  <table width="100%">
    <tr>
      <td>Image 1</td>
      <td>Text</td>
      <td>Image 2</td>
    </tr>
  </table>
</td>

or you can do by creating div with float attributes. Do image1 and text to float:left; and image2 to float:right .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM