Two pictures, one picture floating, why is it close to the left like it?

< div class= "header w" >

<div class="logo1">    
     <img src="img/logo1.png"/ >    
</div>    
<div class="logo">    
    <a href="-sharp" title=""/>    
    <img src="img/logo.png" alt="logo1"/></a>    
 </div>    

< / div >

CSS:

body {background: url (.. / img/header.png) no-repeat;}
.header {padding:32px 0;}
.w {width: 1000px; margin: 0 auto;}
.logo1 {float: left; margin-left: 495px;}

explanation: LOGO1 is the 24-hour picture. According to the principle of floating, the left side of LOG01 should float away from the document stream, the image of LOGO should run to the direction of LOGO1 to overwrite, and then I set the left spacing for LOGO1 should be able to achieve the desired effect. For some reason, LOGO is almost as far away from LOGO1 as LOGO1. Please help me with the answer. Thank you very much. The first picture of PS; is the effect I want, and the second picture is the effect of error

.
Aug.01,2021

I usually use flex bar to easily do logo's div float:left,24 hour logo and Weibo Wechat's div float:right


8102.


after watching it for a long time, next time explain which picture logo refers to. You don't understand what float:left means by breaking away from the document stream. The separation of float will still occupy the text space. You need to use position:absolute
to see

for more details.
Menu