I am new to the html and css and i am trying to learn a few things. I am following a tutorial from Linda and i am stack. I did it again and again and it seems like the bug persists.
The paragraph or < p > contains some words. that the footer overlays. If if do not modify the margin of the footer, the footer will start after the navigation bar(now with the margin it starts 5% further). What i would like to do is to make the footer start after the paragraph.
Please give a helping hand. Thanks in advance. HOW IT LOOKS HTML CODE:
@charset "utf-8";
h1 {
font-size: 2em;
font-family: league-gothic;
font-style: normal;
font-weight: 400;
}
h2 {
font-family: bitter;
font-style: normal;
font-weight: 400;
font-size: 1.2em;
}
nav {
background-color: #222325;
color: #FFFFFF;
text-align: center;
margin-left: 5%;
margin-right: 5%;
}
footer {
text-align: center;
color: #FFFFFF;
background-color: #222325;
font-size: x-small;
margin-top: 5%;
margin-right: 5%;
margin-bottom: 5%;
margin-left: 5%;
padding-top: 5px;
padding-bottom: 5px;
}
body {
font-family: source-sans-pro;
font-style: normal;
font-weight: 200;
}
.assideLeft {
width: 30%;
margin-left: 5%;
margin-right: 2.5%;
float: left;
}
.sectionRight {
width: 50%;
margin-left: 2.5%;
margin-right: 5%;
float: right;
}<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<link href="Styles.css" rel="stylesheet" type="text/css">
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.--><script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/source-sans-pro:n2:default;league-gothic:n4:default;bitter:n4:default.js" type="text/javascript"></script>
</head>
<body>
<header>LADY M
<nav>Home About Fashion Contact </nav>
</header>
<aside class="assideLeft">
<h1>Where fashion meets everyday standards.</h1>
</aside>
<section class="sectionRight">
<h2>Woman News</h2>
<p>I am an economics student that is interested in fashion, mode, trending styles and woman's life style. I have a successful account at Polyvore, where I communicate with other people, check new trend, have fun and doing my part to make the world a more beautiful place.</p>
</section>
<footer>Copyright Alexandros Tsoskounoglou.</footer>
</body>
</html>
Use
on your footer. Here is full documentation https://developer.mozilla.org/en-US/docs/Web/CSS/clear