Header of HTML page getting set as Header of confluence

April 11, 2018

When i write the HTML code in confluence the header which i used for my html page is getting set to the Confluence as well. Attached image for more clarification.

HTML Code:

 <!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>CSS Menus</title>
		<link rel="stylesheet" type="text/css" href="assets/menus.css">
	</head>
	<body>
		<header>
			<a class="logo" href="#"><span>Everyday Things</span></a>
			<nav>
				<ul>
					<li><a href="#">Calendar</a>
						<ul>
							<li><a href="#">ADAS H & S Calendar</a></li>
							<li><a href="#">Team Calendar</a></li>
						</ul>
					</li>
					<li><a href="#">Our Team</a></li>
					
					<li><a href="#">Work Instructions</a>
						<ul>
							<li><a href="#">Pre - Processing</a>
								<ul>
									<li><a href="#">HERE True</a></li>
									<li><a href="#">First Generation</a></li>
								</ul>
							</li>
							<li><a href="#">Processing</a>
								<ul>
									<li><a href="#">HERE True</a></li>									
									<li><a href="#">First Generation</a></li>
									<li><a href="#">Montly Global DFP Runs</a></li>
								</ul>
							</li>
							<li><a href="#">Post - Processing</a>
								<ul>
									<li><a href="#">Monthly</a></li>
									<li><a href="#">Quarterly</a></li>
								</ul>
							</li>
						</ul>	
					</li>
					<li><a href="#">Python Scripts</a></li>
				</ul>
			</nav>
		</header>		
		<article>
			<div>
				<h1>abc:</h1>
				<p></p>
				<p></p>
				<p></p>
			</div>
		</article>
		<aside>
			<div>
				<h3> </h3>
				<p> </p>
			</div>
		</aside>
		
	</body>
</html>

CSS Code :

body { color: #777; font-size: 16px; font-family: sans-serif; margin: 0; padding: 0; }
h1 { margin: 0px 0px 1em 0px; color: #076d6f; font-size: 1.7em; }
h3 { margin: 0px 0px 1.5em 0px; color: #339999; font-size: 1.1em; font-weight: normal; letter-spacing: 2px; text-transform: uppercase; }
a { color: #00a2ff; text-decoration: none; }

header{ height: 450px; background: #eee url("banner.jpg") no-repeat center; margin-bottom: 50px; background-size: cover; position: relative; }
header a.logo { position: absolute; display: block; width: 154px; height: 57px; background: url("logo.jpg") no-repeat  0; background-size: contain; z-index: 1; top: 15px; left: 20px; }
header a.logo span { display: none; }

article { width: 70%; float: left; margin-bottom: 75px; }
article div { padding: 0px 40px 0px 40px; border-right: 1px solid #555; }
aside { width: 30%; float: left; }
aside div { padding: 0px 40px 0px 40px; }

nav { background-color: rgba(0,0,0,.6); position: relative; padding: 45px 0px 0px 180px; }

nav ul { list-style: none; margin: 0; padding: 0; }


nav ul::after { content: ''; display: block; clear: both; }
nav ul li:hover { background-color: rgba(0,102,102,.8); }
nav ul li:hover > ul { display: block; }

nav ul li a { display: inline-block; color: #fff; padding: 10px 20px; text-decoration:none; width: 125px; }
nav ul li a:hover{ background-color: #339999 }

nav ul ul { display: none; position: absolute; background-color: rgba(0,102,102,.8); }
nav ul ul li { position: relative; }
nav ul ul ul { left:100%; top: 0; }



/* top level*/
nav > ul { padding-left: 35px; }
nav > ul > li { float: left; }
nav > ul > li > a { padding: 10px 20px 15px 20px; width: auto; }


@media screen and (max-width: 750px) 
	
	header a.logo { width: 120px; height: 44px; }
	article { width: 100%; float: none; margin-bottom: 40px; }
	article div { margin: 0px 40px; padding: 0px 0px 30px 0px; border-right: none; border-bottom: 1px solid #555; }
	aside { width: 100%; float: none; }
	
	/*nav { padding: 70px 0px 0px 10px; }
	nav > ul { padding-left: 0px; padding-right: 20px; }
	nav > ul > li > a { padding: 8px 12px 10px 12px; } */

}

Product Q&A

Community resources

Support

Top groups

Community resources

Support

Learn

Community resources

Support

Events

Community resources

Support

Get product advice from experts

Join a community group

Advance your career with learning paths

Earn badges and rewards

Connect and share ideas at events

Header of HTML page getting set as Header of confluence

0 answers

Suggest an answer

TAGS

Atlassian Community Events