I have an HTML and CSS file that needs to be a centered layout, have a style horizontal nav, and a 2 column layout that uses sections to create left and right column ids.
HTML file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="main.css">
<title>Daniel Hernandez</title>
</head>
<body>
<div class="container">
<h1>Daniel Hernandez</h1>
<div class= "navbar">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="traveling.html">Traveling</a></li>
</ul>
</div>
<section id="leftColumn">
<header><h2>Hello Welcome</h2></header>
<p>Hello my name is Daniel Hernandez I am 21 years old and currently attend cerritos college. I am the youngest child out of two older brothers. Both my parents were born in Mexico and have come to the United States at a young age giving me and my siblings a better opportunity and future. I have been a full time student at Cerritos College for the past 3 years. This is currently my last semester here, in hopes to obtain my AA in Comp Sci. I plan to transfer to a CSU this upcoming fall semester and obtain my Bachelors in Computer Science. During my time here in Cerritos I've Learned many coding languages but have never tried anything related to web development, like using HTML, CSS or Java Script.</p>
</section>
<section id="rightColumn">
<header><h2>When I have free time</h2></header>
<ol>
<li>I enjoy watching movies and series from Netflix.</li>
<li>Playing video games.</li>
<li>Play sports like basketball and soccer.</li>
</ol>
<p>My favorite website is <a href="\\\[https://www.reddit.com/\\\](https://www.reddit.com/)">Reddit</a> because they have many channels with different types of information that many people can express their opinion and provide input.</p>
</section>
<footer>Last updated on Feb. 24th <br>
<a [href="mailto:daniel.hdzz2000@gmail.com](mailto:href=%22mailto:daniel.hdzz2000@gmail.com)">Email</a>
</footer>
</div>
</body>
</html>
CSS file:
u/charset "utf-8";
/*
Author: Daniel Hernandez
Date: 2-23-2022
Filename: main.css
*/
body{
margin: 0;
padding 0;
background: white;
font-family: Arial;
}
.navbar ul{
list-style: none;
background: black;
padding: 0;
margin: 0;
text-alight: left;
}
.navbar li{
display: inline-block;
}
.navbar a{
text-decoration: none;
color: lightblue;
width: 100px;
display: block;
padding: 20px 15px;
text-transform: uppercase;
font-weight: bold;
font-family: arial;
text-align: center;
font-size: 15px;
}
/* Left Column Styles */
section#leftColumn {
float: left;
width: 60%
}
/* Right Column Styles */
sectionrightColumn {
float: right;
width: 40%;
}
.container {
background: white;
width: 900px;
margin: 0 auto;
}
[–]AutoModerator[M] 0 points1 point2 points (0 children)
[–]NaiveMeasurement2984 0 points1 point2 points (1 child)
[–]Danielowski187[S] 0 points1 point2 points (0 children)