Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
0

Help a student out! You can see my webpage while in design but not in Live Mode (CS6) Please Help!

Community Beginner ,
Apr 28, 2017 Apr 28, 2017

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>

Views

438
Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Apr 28, 2017 Apr 28, 2017

<!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

...

Votes

Translate
Community Expert ,
Apr 28, 2017 Apr 28, 2017

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.

CC-error-indicators.jpg

CC-BugReport.jpg

Nancy

Nancy O'Shea— Product User, Community Expert & Moderator

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 28, 2017 Apr 28, 2017

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?

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 28, 2017 Apr 28, 2017

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.

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 28, 2017 Apr 28, 2017

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>

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 28, 2017 Apr 28, 2017

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>

Nancy O'Shea— Product User, Community Expert & Moderator

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 28, 2017 Apr 28, 2017

Copy link to clipboard

Copied

Thank you so much you are a life saver

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 28, 2017 Apr 28, 2017

Copy link to clipboard

Copied

It's crazy how much one thing effects your stuff!

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Apr 28, 2017 Apr 28, 2017

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-->

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
May 01, 2017 May 01, 2017

Copy link to clipboard

Copied

Hello Nancy! May I ask your help one more time?

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
May 01, 2017 May 01, 2017

Copy link to clipboard

Copied

LATEST

This question has been answered.  Please start a new discussion.  You'll get more answers that way.

Nancy

Nancy O'Shea— Product User, Community Expert & Moderator

Votes

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines