Tonight, I am going to start making my website more professional looking and start adding content. The first issue I would like to adress is one that has been bugging me for a long time. If you go to my website, you will see that the boxes are off centered (and floating to the left) while everything else is lining up in the center. ive gone over my html/css/php code, but I can't figure out the issue (Web based programming is not one of my strong suits, however I would rather learn and code it myself instead of paying someone to do it for me). Anyways, the generated html code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Dragon Tooth Software</title>
<link rel="icon" href="/images/favicon.ico" />
<link rel="stylesheet" href="css/main.css" />
<link rel="stylesheet" href="css/font.css" />
<link rel="stylesheet" href="css/banner.css" />
<link rel="stylesheet" href="css/navbar.css" />
<link rel="stylesheet" href="css/index.css" />
<link rel="stylesheet" href="css/box.css" />
<meta name="google-site-verification" content="1OG6sLqFnSg_Azq0tJjkpqPklx0KhO1cu7S5ii60FKc" />
</head>
<body>
<header>
<a href="/index.php"><img src="/images/banner.jpg" height="100px" width="925px" /></a>
<h1>Dragon Tooth Software</h1>
<h2>Rule the Web</h2>
</header>
<nav>
<ul>
<li class="current"><a href="index.php">Home</a></li>
<li><a href="about.php">About</a></li>
<li><a href="contact.php">Contact Us</a></li>
<li><a href="projects.php">Projects</a></li>
<li><a href="tutorials.php">Tutorials</a></li>
</ul>
</nav>
<div class="content-box">
<h1 class="header">Welcome to Dragon Tooth Software</h1><p class="content">Greetings! I am DTSCode!</p>
</div><br /><div class="content-box">
<h1 class="header">Thursday, July 17<sup>th</sup>, 2014</h1><p class="content">www.dragontoothsoftware.com is officially open!</p>
</div><br /> </body>
</html>
and the css file that makes up the box:
.content-box {
float: center;
padding: 20px;
border-radius: 10px;
border: 10px solid gray;
}
