Hoe een afbeelding te verplaatsen met css/html

Ik probeer een afbeelding te verplaatsen. Ik wil dat het wordt uitgelijnd met de titel “Ervaring”. Hier is mijn code

html-code

<header>
    <h1>Experience</h1>
        <div class="logo">
            <img src="./img/exp.png">
        </div>
</header>

en de css-code

.logo{
width: 100px;
    }
.logo img{
float: left;
margin-left: 0px 0px 0px 30px;
width: 150px;
height: 38px;
}

Antwoord 1, autoriteit 100%

Pas de CSS een beetje aan:

.logo{
    width: 100px;
    display: inline-flex;
}
.logo img{
    margin: auto 5px;
    float: left;
    width: 150px;
    height: 38px;
}

Werkt dit?

Deze oplossing werkte voor mij, maar ik heb geen idee voor je omdat je niet je volledige code hebt ingevoerd…

Antwoord 2

Nou, kijkend naar wat je wilt, werkt dit misschien:
verplaats de img-tag in de header-tag (h1) en geef deze css.
Dit is wat ik deed:

<h1>Experience<img style="margin-left:10px" src="./img/exp.png" ></img>
</h1>

OF om de afbeelding onder de tekst te laten komen:

<h1>Experience<img style="display:block;margin-left:10px" src="./img/exp.png" ></img>
    </h1>

Antwoord 3

Probeer float:left toe te voegen aan .logo en instelling display: inline-block op je h1, zoals zo:

  *{
      margin: 0px;
      padding: 0px;
      font-family: Arial, Helvetica, Sans-serif;
      font-size: 34px
    }
    header{
        background-image: url(../img/bar.png);
        background-color: #00B9ED;
        height: 75px;
        border-bottom: 0px;
        padding-left: auto;
        padding-right: auto;
        width: 100%; 
    }   
    .logo{
        width: 100px;
        float: left;
        //display: inline-flex;
        }
    .logo img{
        margin: auto 5px;
        float: left;
        width: 150px;
        height: 38px;
    }
    h1 {
        display: inline-block;
    }

Antwoord 4

Hoe zit het met het maken van marge-links: 0%; en marge-rechts. Hangt ervan af waar je het wilt verplaatsen.
Je gebruikte steno voor margin-left. We gebruiken alleen steno voor marge. Je hebt in plaats daarvan marge-links: rechtsboven linksonder gedaan. Ik denk dat het programma dat niet goed leest.