Ads by ProfitSence
Close

Logo image & Heading on the same line

Last Updated on Wednesday 5th Oct 2022

HTML Logo in Header

Html Image in Header.

  • Put both elements in a container DIV.
			
					<div class="header">
  <img src="img/logo.png" alt="logo" />
  <h1>My website name</h1>
</div>

			
	

Image in Header HTML

			
					.header img {
  float: left;
  width: 100px;
  height: 100px;
  background: #555;
}

.header h1 {
  position: relative;
  top: 18px;
  left: 10px;
}

			
	

Header with logo

Use BootStrap

			
					<div class="row">
    <div class="col-md-4">
        <img src="img/logo.png" alt="logo" />
    </div>
    <div class="col-md-8">
        <h1>My website name</h1>
    </div>
</div>