Header Sizes

Code Example

<header id="header" class="full-header header-size-sm">
	...
</header>

Ways to Modify Header Heights

• Default Header Sizes

  Control your Header Heights using the following predefined Header Sizes:

  • .header-size-sm – For a Header Size of 60px
  • .header-size-md – For a Header Size of 80px
  • .header-size-lg – For a Header Size of 120px

  You will need to add these Classes on the #header Tag.

• Custom CSS

  Use this CSS Code in the css/custom.css File to modify the Header Size.

  Copy

  :root {
  	--cnvs-header-height: 100px;
  	--cnvs-header-height-sm: 60px;
  	--cnvs-header-height-md: 80px;
  	--cnvs-header-height-lg: 120px;
  	--cnvs-header-height-shrink: 60px;
  	--cnvs-side-header-width: 260px;
  }