Copy link to clipboard
Copied
I'll post my code and see if you guys can help me out. Just like the title says, I cannot see my page in Live view. It is just white, with some writing on it. Please help!
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>InVoke Studios</title>
<style type="text/css">
body {
font-family:Verdana, Geneva, sans-serif;
font-size: 14px;
line-height: 1.5em;
color: #333333
#conatiner {
height: 768px;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
header {
font-family:Verdana, Geneva, sans-serif
height: 125px;
width: 1024px;
background-color: #000;
color: #FFF;
}
#TitleBar {
height: 50px;
width: 1024px;
}
#Main {
height: 448px;
width: 1024px;
}
#Main #contentOne {
height: 448px;
width: 512px;
float: left;
}
#Main #ContentTwo {
height: 448px;
width: 512px;
float: right;
}
#innerMain {
background-color: #33C;
height: 448px;
width: 1024px;
}
#TitleBar {
background-color: #6FC;
}
#TopNav {
height: 45px;
width: 1024px;
}
footer {
height: 100px;
width: 1024px;
}
footer #BottomNav {
height: 50px;
width: 1025px;
}
h1 {
font-family: "Comic Sans MS", cursive;
}
h2 {
margin: 0px;
}
h1 {
font-size: 4em;
}
h2 {
font-size: 1.5em;
}
header {
padding-top: 35px;
padding-left: 35px;
}
header {
height: 95px;
width: 989px;
}
#TitleBar {
text-align: center;
height: 35px;
padding-top: 15px;
}
#TopNav a {
}
#TopNav a {
color: #F63;
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
display: inline-block;
margin-right: 15px;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 15px;
width: 1009px;
height: 35px;
}
#TopNav a hover {
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #F63;
}
#TitleBar {
background-color: #33C;
}
#TitleBar h2 {
color: #FFF;
}
</style>
</head>
<body>
<div id="conatiner">
<header>
<h1>InVoke Studios</h1>
</header>
<div id="TitleBar">
<h2>Creative Minds +</h2>
</div><!-- end TitleBar -->
<nav id="TopNav">
<p><a href="#">Home</a> <a href="https://www.youtube.com/channel/UCeloVM6iK0SHFLKhy8oUkuA">Youtube</a> <a href="#">Art</a> <a href="#">Podcast</a> <a href="#">Contact Us</a></p>
</nav><!-- end TopNav -->
<div id="Main">
<div id="innerMain">Content for id "innerMain" Goes Here</div><!-- end innerMain -->
<div id="contentOne">Content for id "contentOne" Goes Here </div><!--end content one -->
<div id="ContentTwo">contents for id "Content two goes here"</div>
<!-- end "content two" -->
</div><!-- end innerMain -->
</div><!-- end main-->
<footer>
<nav id="BottomNav">Bottom Nav</nav>
</footer>
</div><!-- end container -->
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>InVoke Studios</title>
<style>
body {
font-family:Verdana, Geneva, sans-serif;
font-size: 14px;
line-height: 1.5em;
color: #333333;
}
#container {
height: 768px;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
header {
font-family:Verdana, Geneva, sans-serif height: 125px;
width: 1024px;
background-color: #000;
color: #FFF;
}
#TitleBar {
height: 50px;
width: 1024px;
}
#Main {
height: 448px;
width: 1024px;
}
#Main #contentOne {
h
...Copy link to clipboard
Copied
You're missing a closing brace } in your CSS code after the <body> selector.
When things fall apart it's almost always caused by code errors. Pay attention to the code error indicators. Use Validation panel to check your HTML documents. See screenshots from CC 2017.
Nancy
Copy link to clipboard
Copied
Thank you so much Nancy! You are Seriously the best! now my website can go on live, but the formatting is off? Is it again another Simple mistake?
Copy link to clipboard
Copied
Sorry, My teacher is not much help! but here's my updated code. THANK YOU SO MUCH FOR THE HELP. I have been in frustration for a few hours, trying to get it to work.
Copy link to clipboard
Copied
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>InVoke Studios</title>
<style type="text/css">
<body> }
font-family:Verdana, Geneva, sans-serif;
font-size: 14px;
line-height: 1.5em;
color: #333333
#conatiner {
height: 768px;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
header {
font-family:Verdana, Geneva, sans-serif
height: 125px;
width: 1024px;
background-color: #000;
color: #FFF;
}
#TitleBar {
height: 50px;
width: 1024px;
}
#Main {
height: 448px;
width: 1024px;
}
#Main #contentOne {
height: 448px;
width: 512px;
float: left;
}
#Main #ContentTwo {
height: 448px;
width: 512px;
float: right;
}
#innerMain {
background-color: #33C;
height: 448px;
width: 1024px;
}
#TitleBar {
background-color: #6FC;
}
#TopNav {
height: 45px;
width: 1024px;
}
footer {
height: 100px;
width: 1024px;
}
footer #BottomNav {
height: 50px;
width: 1025px;
}
h1 {
font-family: "Comic Sans MS", cursive;
}
h2 {
margin: 0px;
}
h1 {
font-size: 4em;
}
h2 {
font-size: 1.5em;
}
header {
padding-top: 35px;
padding-left: 35px;
}
header {
height: 95px;
width: 989px;
}
#TitleBar {
text-align: center;
height: 35px;
padding-top: 15px;
}
#TopNav a {
}
#TopNav a {
color: #F63;
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
display: inline-block;
margin-right: 15px;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 15px;
width: 1009px;
height: 35px;
}
#TopNav a hover {
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #F63;
}
#TitleBar {
background-color: #33C;
}
#TitleBar h2 {
color: #FFF;
}
</style>
</head>
<body>
<div id="conatiner">
<header>
<h1>InVoke Studios</h1>
</header>
<div id="TitleBar">
<h2>Creative Minds +</h2>
</div><!-- end TitleBar -->
<nav id="TopNav">
<p><a href="#">Home</a> <a href="https://www.youtube.com/channel/UCeloVM6iK0SHFLKhy8oUkuA">Youtube</a> <a href="#">Art</a> <a href="#">Podcast</a> <a href="#">Contact Us</a></p>
</nav><!-- end TopNav -->
<div id="Main">
<div id="innerMain">Content for id "innerMain" Goes Here</div><!-- end innerMain -->
<div id="contentOne">Content for id "contentOne" Goes Here </div><!--end content one -->
<div id="ContentTwo">contents for id "Content two goes here"</div>
<!-- end "content two" -->
</div><!-- end innerMain -->
</div><!-- end main-->
<footer>
<nav id="BottomNav">Bottom Nav</nav>
</footer>
</div><!-- end container -->
</body>
</html>
Copy link to clipboard
Copied
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>InVoke Studios</title>
<style>
body {
font-family:Verdana, Geneva, sans-serif;
font-size: 14px;
line-height: 1.5em;
color: #333333;
}
#container {
height: 768px;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
header {
font-family:Verdana, Geneva, sans-serif height: 125px;
width: 1024px;
background-color: #000;
color: #FFF;
}
#TitleBar {
height: 50px;
width: 1024px;
}
#Main {
height: 448px;
width: 1024px;
}
#Main #contentOne {
height: 448px;
width: 512px;
float: left;
}
#Main #ContentTwo {
height: 448px;
width: 512px;
float: right;
}
#innerMain {
background-color: #33C;
height: 448px;
width: 1024px;
}
#TitleBar { background-color: #6FC; }
#TopNav {
height: 45px;
width: 1024px;
}
footer {
height: 100px;
width: 1024px;
}
footer #BottomNav {
height: 50px;
width: 1025px;
}
h1 { font-family: "Comic Sans MS", cursive; }
h2 { margin: 0px; }
h1 { font-size: 4em; }
h2 { font-size: 1.5em; }
header {
padding: 35px 0 0 35px;
min-height: 95px;
width: 989px;
}
#TitleBar {
text-align: center;
height: 35px;
padding-top: 15px;
}
#TopNav a {
color: #F63;
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
display: inline-block;
margin-right: 15px;
padding: 10px 0 0 15px;
width: 1009px;
height: 35px;
}
#TopNav a hover {border-bottom: 2px solid #F63;}
#TitleBar {background-color: #33C;}
#TitleBar h2 {color: #FFF;}
</style>
</head>
<body>
<div id="container">
<header>
<h1>InVoke Studios</h1>
</header>
<div id="TitleBar">
<h2>Creative Minds +</h2>
</div>
<nav id="TopNav">
<p><a href="#">Home</a> <a href="https://www.youtube.com/channel/UCeloVM6iK0SHFLKhy8oUkuA">Youtube</a> <a href="#">Art</a> <a href="#">Podcast</a> <a href="#">Contact Us</a></p>
</nav>
<div id="Main">
<div id="innerMain">Content for id "innerMain" Goes Here</div>
<div id="contentOne">Content for id "contentOne" Goes Here </div>
<div id="ContentTwo">contents for id "Content two goes here"</div>
<!--/main--></div>
<footer>
<nav id="BottomNav">Bottom Nav</nav>
</footer>
<!--/container--></div>
</body>
</html>
Copy link to clipboard
Copied
Thank you so much you are a life saver
Copy link to clipboard
Copied
It's crazy how much one thing effects your stuff!
Copy link to clipboard
Copied
You have duplicated your closing </div> for innerMain:
<div id="Main">
<div id="innerMain">Content for id "innerMain" Goes Here</div><!-- end innerMain -->
<div id="contentOne">Content for id "contentOne" Goes Here </div><!--end content one -->
<div id="ContentTwo">contents for id "Content two goes here"</div><!-- end "content two" -->
</div><!-- end innerMain -->
</div><!-- end main-->
Copy link to clipboard
Copied
Hello Nancy! May I ask your help one more time?
Copy link to clipboard
Copied
This question has been answered. Please start a new discussion. You'll get more answers that way.
Nancy