question

abcabc-6368 avatar image
0 Votes"
abcabc-6368 asked abcabc-6368 edited

In MFC in CDHtmlDialog,how to vertically and horizontally center align img inside div?

Hi

I am using windows 10 and VS2019. In MFC in CDHtmlDialog, how to vertically and horizontally center align img inside div?

CDHtmlDialog isnot supporting display:flex and display:table-cell.

My HTML
----------

<TABLE WIDTH="100%" cellspacing=0 cellpadding=0 >

     <tr>
     <td>
       <div class="parent">
         <img class="im" src="https://d30y9cdsu7xlg0.cloudfront.net/png/255751-200.png" />
      <img class="im" src="https://d30y9cdsu7xlg0.cloudfront.net/png/255751-200.png" />
     </div>
 </td>
 </td>
 <table>

My CSS style



 .parent {
      display:inline;
      vertical-align:middle;
      height:100px;
      background: red;
      width:300px;
     }
        
     .im {
       height: 50px;
     }



c++
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

Viorel-1 avatar image
2 Votes"
Viorel-1 answered abcabc-6368 edited

Since you use absolute sizes, then try this table:

 <table WIDTH="100%" cellspacing=0 cellpadding=0>
     <tr>
         <td>
             <div class="parent" style="text-align: center">
                 <span style="position: relative; top: 25px;" ">
                     <img class="im" src="https://d30y9cdsu7xlg0.cloudfront.net/png/255751-200.png" />
                     <img class="im" src="https://d30y9cdsu7xlg0.cloudfront.net/png/255751-200.png" />
                 </span>
             </div>
         </td>
     </tr>
 </table>
· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Thanks Viorel.

My image size is not 50px,it is 20px. Image size is not exactly half height of parent div
I wan to set parent height as 100px and inside div height as 60px and image height as 20px. I want inside div to be vertical aligned to parent div and image should be vertical aligned to inside div.

How to implement this?

0 Votes 0 ·

Try 'top: 40px' instead of 'top: 25px'.

0 Votes 0 ·