Horizontal Fixed Layout with Icon
Horizontal Fixed with icon layout is useful for those users who only wants menu options on top.
CSS Class
To use static layout for your project add
.horizontal-icon class in body tag.
js option
To use Compact Menu for your project add
themelayout: 'horizontal', FixedNavbarPosition: true, FixedHeaderPosition: true, class in js.
HTML Markup
Use the following code to use Horizontal Fixed Layout with Icon in horizontal.
Usage:
Markup
$( document ).ready(function() {
$( "#pcoded" ).pcodedmenu({
themelayout: 'horizontal',
FixedNavbarPosition: true,
FixedHeaderPosition: true,
});
});
<!DOCTYPE html>
<html lang="en">
<head></head>
<body class="horizontal-icon">
<div class="card">
<div class="card-header">
<h5>Hello card</h5>
<span> Lorem ipsum dolor sit amet, consectetur adipisicing elit</span>
<div class="card-header-right">
<i class="icofont icofont-rounded-down"></i>
<i class="icofont icofont-refresh"></i>
<i class="icofont icofont-close-circled"></i>
</div>
</div>
<div class="card-block">
<p>
Enjoy flat-able With Horizontal Static Layout with Icon
</p>
</div>
</div>
</body>
</html>