smart application header code example
Example: smart section header
<!DOCTYPE html>
<html>
<head>
<title>smart section header</title>
<style>
.section-header {
border-bottom:2px solid #fcba03;
box-sizing:border-box;
display:block;
font-family: "roboto",sans-serif;
font-size: 14px;
line-height: 1.5;
color: #333;
}
.section-header-title {
display:inline-block;
margin:0;
padding:5px 20px;
text-align:left;
color: #fff;
box-sizing: border-box;
}
</style>
</head>
<body>
<div class="section-header" style="border-color:#1c588a;">
<p class="section-header-title" style="background-color:#1c588a">Technology</p>
</div>
<p>----</p>
<div class="section-header" style="border-color:#fcba03;">
<p class="section-header-title" style="background-color:#fcba03">Business</p>
</div>
</body>
</html>