Place Elements With Multiple Styles Overlap

I need help placing my items. I'm just starting out so I need explanations. What will seem obvious to you, will not necessarily be so for me :) I have a header that I want to impro

Solution 1:

sorry, i should explain better, here is an example of what im saying

<divclass="site-branding"><divclass="logo-main"style="text-align:left;" ><h1class="site-title semantic">Hotel LOGIS LA BORIE en Périgord Noir</h1><ahref="https://hotel-restaurant-la-borie.fr/"rel="home"class="site-logo"><imgid="desktop-logo"src="https://hotel-restaurant-la-borie.fr/wp-content/uploads/2017/04/Transparent.png"alt="Hotel LOGIS LA BORIE en Périgord noir"width="988"height="614"><imgid="retina-logo"src="https://hotel-restaurant-la-borie.fr/wp-content/uploads/2017/04/Transparent.png"alt="Hotel LOGIS LA BORIE en Périgord noir"width="988"height="614"></a><divclass="tel-header" >Tel. +33 (0 53 28 97 60</div></div><divclass="form-reservation"><divclass="logo-logis" ><ahref="https://hotel-restaurant-la-borie.fr/wp-content/uploads/2020/12/sejoursur-logis.mp4"target="_blank"rel="noopener noreferrer"><imgsrc="https://hotel-restaurant-la-borie.fr/wp-content/uploads/2020/12/BANDEAU-MAIL-400X100px-SEJOUR-PLUS-SUR-1.jpg"alt="lien de réservation"style="width: 400px !important;"></a></div><divclass="group-input" ><divclass="logo-logis"style="position:relative;height:120px"><ahref="https://www.logishotels.com/fr/hotel/-254254?partid=568&amp;layout=search&amp;ref=r"target="_blank"rel="noopener noreferrer"style="position:absolute;bottom:0;left:0;z-index:1"><imgstyle="width: 105px !important;"src="https://hotel-restaurant-la-borie.fr/wp-content/uploads/2017/04/reservez-1.png"alt="lien de réservation"width="112"height="25"></a><ahref="https://www.logishotels.com/fr/hotel/hotel-la-borie-254254?PARTID=1012&amp;gclid=Cj0KCQjwvLLZBRDrARIsADU6ojBX_SZoGK4q8u1U_o9D7ym88hIxs1SkPMDf8VeswMveqWXBDF70HFsaApIXEALw_wcB"target="_blank"style="position:absolute;top:0;left:0"><imgstyle="width: 105px !important;"src="https://hotel-restaurant-la-borie.fr/wp-content/themes/morrison-hotel/images/log-logis.png" ></a></div></div></div></div>

Solution 2:

you could translate the image by using css

img{
  transform: translateX(calc(100% + 10px))
}

the code move the image to right by 100% + 10px for example

or try to put the two images in the same tag then add to the top reservez button:

bottom:0z-index:1

this will put it on the bottom and front