Solution 1 :

<div class="flex-layout">
  <div class="flex-item"><h3>Neue Einkaufsliste</h3></div>
  <div class="flex-item"><img src="img/close.png" alt="close button"></div>

display: flex;
flex-wrap: no wrap;

.flex-item img{
width: (**Fixed width**px)

Problem :

I have a simple problem: I want to put a text and an image in one row. I tried with display flex but it always resizes the image, that’s not what I want.

This is my html code:

 <span class="head_form">
     <h3>Neue Einkaufsliste</h3>
     <img src="img/close.png" alt="close button">

This is my CSS:

display: flex;
flex-wrap: wrap;}

I also want to put the closing imgage at the very right in the box. It always looks like this:

enter image description here

It’s probably quite easy to solve but I’m so confused by now. I’m thankful for any help 🙂


Comment posted by…

I guess they discuss it here

Comment posted by s.kuznetsov