I am using HTML for the first time to create a website for a school project. I have tried looking at other posts/questions and the Code Academy course that I had taken, and I don’t have the slightest clue of what I am doing wrong. It appears that my stylesheet is not communicating to my html.
The website is disruptclothing.shop. I am trying to get the main image to be centered, and not go off-screen or extend the website.
My index.html:
<!DOCTYPE html>
<html>
<head>
<title>disrupt.</title>
<link rel="stylesheet" type="text/css" href="main.css"/>
</head>
<body>
<div class="main-center">
<img src="-link not allowed-"/>
</div>
<h2 style="text-align: center;">Website is under construction!</h2>
<h2 style="text-align: center;">If you need assistance, please contact [email protected]</h2>
<p style="text-align: center;">Disrupt Clothing is a clothing brand that is aimed towards creating stylish and comfortable clothing for mountain bikers. We design everything ourselves, and a percentage of our revenue will be donated to our local trail system.</p>
<h6 style="text-align: center;">Not all of it though, I still have to pay the bills ;)</h6>
<footer style="text-align: center">© Disrupt Clothing</footer>
</body>
</html>
My main.css:
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
I tried looking on other websites and nothing that they had seemed to work. I also looked at other similar issues on here, to no avail.