Skip navigation
Currently Being Moderated

Page that is uploaded to the server looks different from the preview in Dreamweaver browser

Jul 31, 2012 9:13 PM

Tags: #background #color #div

Hi, I have a couple of questions.  Does anyone happen to know why my homepage looks different in Dreamweaver when I preview in browser then it does when I upload the page onto the server?  http://www.iewaterkeeper.org/  I see a join our mailing list button is intact when I preview in browser but is no where to be found when I view the uploaded page from the server.  Other weird things have been going on with Dreamweaver today like I wasn't able to absolute position a div tag in it's intended place and all the typography on my homepage looks very blurry in Dreamweaver but looks clearer when it's uploaded to the server.  Does anyone know what's going on?  Any help would be greatly appreciated.  .... Could it be a virus?

 
Replies
  • Currently Being Moderated
    Jul 31, 2012 9:16 PM   in reply to Ivy54

    I tried to fill in the background color for that div tag but the color is different from the other grey areas even though it's the same 6 digit hex

     

    What hex code did you use?  Can't see anything added.  I suggest use color: #EEEEEE to match the rest of the colors on the page.

     

     

    The other thing is that there's a line next to the Waterkeeper on Facebook sign and I'm also not sure how to fill in that gap either.

     

    It is an image as far as I can see:  The image is this:

     

    <http://www.iewaterkeeper.org/_images/facebooktop.gif>

     

    If this not so then point exactly what do you mean by " line next to the waterkeeper facebook sign"

     
    |
    Mark as:
  • Currently Being Moderated
    Aug 1, 2012 8:31 AM   in reply to Ivy54

    You don't have a class called 'facebookmailinglist' in your css file its called 'mailinglist'

     

    So you need to amend this:

     

    <div class="facebookmailinglist">

     

    to this:

     

    <div class="mailinglist">

     
    |
    Mark as:
  • Currently Being Moderated
    Aug 1, 2012 8:16 AM   in reply to Ivy54

    Validate your code and fix the important errors (non-FaceBook ones.)

    http://validator.w3.org/

    You're missing a closing </div> tag for container.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Aug 1, 2012 1:21 PM   in reply to Ivy54

    That is telling you that the referenced div tag has no closing div tag associated with it, e.g.,

     

    instead of this - <div>whatever</div>, you have just this - <div>whatever

     

    Every opening div tag must have a corresponding closing tag, as do most other HTML tags.

     
    |
    Mark as:
  • Currently Being Moderated
    Aug 1, 2012 1:38 PM   in reply to Ivy54

    The error message you showed is looking for a closing </div> - just as it says in the error message.  I'm not sure where your notion of it being the body tag came from....

     

    OH  - I see how you got that idea.  But it's a div closing that is needed.

     
    |
    Mark as:
  • Currently Being Moderated
    Aug 1, 2012 2:51 PM   in reply to Ivy54

    Make a backup of your original page.  Then try this HTML -

     

    <!doctype html>

    <html>

    <head>

    <meta charset="utf-8">

    <title>Inland Empire Waterkeeper</title>

    <link href="_css/styles.css" rel="stylesheet" type="text/css">

    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>

    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">

    <style type="text/css">

    body,td,th {

        color: #999999;

        font-family: Verdana, Geneva, sans-serif;

    }

    body {

        background-color: #FFFFFF;

        color: #D6D6D6;

        background-image: url(_images/background_1255hompage.png);

        background-repeat: repeat-x;

        margin: auto;

        margin-left: 0px;

        margin-top: 0px;

        margin-right: 0px;

        margin-bottom: 0px;

    }

    </style>

    </head>

     

    <body>

     

    <div id="fb-root"></div>

    <script>(function(d, s, id) {

      var js, fjs = d.getElementsByTagName(s)[0];

      if (d.getElementById(id)) return;

      js = d.createElement(s); js.id = id;

      js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";

      fjs.parentNode.insertBefore(js, fjs);

    }(document, 'script', 'facebook-jssdk'));</script>

     

     

    <div class="container">

      <div class="header"><img src="_images/banner1.jpg" alt="Inland Empire Waterkeeper" width="933" height="300"></div>

      <div class="menubar">

        <ul id="MenuBar1" class="MenuBarHorizontal">

          <li><a href="index.html" class="MenuBarItemSubmenu">Home</a>

            <ul>

              <li><a href="mission.html" class="MenuBarItemSubmenu">About Us</a>

                <ul>

                  <li><a href="mission.html">Our Mission</a></li>

                  <li><a href="history.html">Our History</a></li>

                  <li><a href="community.html">Our Community</a></li>

                </ul>

              </li>

              <li><a href="staff.html" class="MenuBarItemSubmenu">Our Team</a>

                <ul>

                  <li><a href="staff.html">Staff</a></li>

                  <li><a href="supporters.html">Supporters</a></li>

                  <li><a href="advisoryboard.html">Advisory Board</a></li>

                </ul>

              </li>

              <li><a href="coastkeeper.html">Coastkeeper</a></li>

            </ul>

          </li>

          <li><a href="projects.html" class="MenuBarItemSubmenu">What We Do</a>

            <ul>

              <li><a href="advocacy.html" class="MenuBarItemSubmenu">Programs</a>

                <ul>

                  <li><a href="advocacy.html">Advocacy</a></li>

                  <li><a href="education.html">Education</a></li>

                  <li><a href="research.html">Research</a></li>

                  <li><a href="restoration.html">Restoration</a></li>

                  <li><a href="enforcement.html">Enforcement</a></li>

                </ul>

              </li>

              <li><a href="projects.html">Projects</a></li>

              <li><a href="datareports.html">Data &amp; Reports</a></li>

            </ul>

          </li>

          <li><a href="volunteer.html" class="MenuBarItemSubmenu">Get Involved</a>

            <ul>

              <li><a href="volunteer.html">Volunteer</a></li>

              <li><a href="employment.html">Employment</a></li>

              <li><a href="events.html">Events &amp; Meetings</a></li>

              <li><a href="donate.html">Donate</a></li>

            </ul>

          </li>

          <li><a href="pressreleases.html" class="MenuBarItemSubmenu">News Room</a>

            <ul>

              <li><a href="pressrelease.html">In the News and Press Releases</a></li>

              <li><a href="legislation.html">Legislative Updates</a></li>

              <li><a href="waternews.html">Water in the News</a></li>

            </ul>

          </li>

          <li><a href="reportpollution.html" class="MenuBarItemSubmenu">Resources</a>

            <ul>

              <li><a href="watershed.html" class="MenuBarItemSubmenu">Information</a>

                <ul>

                  <li><a href="watershed.html">Our Watershed</a></li>

                  <li><a href="reportpollution.html">Report Pollution</a></li>

                </ul>

              </li>

              <li><a href="photos.html">Photo Gallery</a></li>

            </ul>

          </li>

          <li><a href="contact.html">Contact Us</a></li>

        </ul>

      </div>

     

        <div class="missionstatement"><img src="_images/mssionstatement.gif" alt="Inland Empire Waterkeeper" width="933" height="110"></div>

     

    <div class="space1"><img src="_images/bar_left.png" alt="Inland Empire Waterkeeper" width="20" height="315"></div>

    <div class="facebook">

          <div class="facebooktop">

          <img src="_images/facebooktop.gif" width="106" height="125" alt="Inland Empire Waterkeeper"></div>

     

     

     

        <div class="facebookmailinglist">

     

        <div class="fb-like" data-href="http://www.iewaterkeeper.org/" data-send="true" data-width="106" data-show-faces="false"></div>

    <!-- BEGIN: Constant Contact Standard Email List Button -->

    <div align="center">

    <table border="0" cellpadding="0" cellspacing="0">

    <tr>

    <td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tl_gray.gif" width="6" height="6" alt=""></td>

    <td style="background-image:url(https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_top_gray .gif)"> </td>

    <td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tr_gray.gif" width="6" height="6" alt=""></td>

    </tr>

    <tr>

    <td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_left_gra y.gif"></td>

    <td bgcolor="#cccccc"><a href="http://visitor.r20.constantcontact.com/d.jsp?llr=wejp69bab&p=oi&m=1101 488694422" target="_blank" style="text-decoration:none; font-weight: bold;  font-family:Arial; font-size:10px; color:#336666;">Join Our Email List</a></td>

    <td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_right_gr ay.gif"></td>

    </tr>

    <tr>

    <td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bl_gray.gif" width="6" height="6" alt=""></td>

    <td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_bottom_g ray.gif"> </td>

    <td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_br_gray.gif" width="6" height="6" alt=""></td>

    </tr>

    </table>

    </div>

    <!-- END: Constant Contact Standard Email List Button -->

        </div>  

     

        <div class="space2"><img src="_images/bar_right.png" width="21" height="315" alt="Inland Empire Waterkeeper"></div>

     

       <div class="video"><iframe width="560" height="315" src="http://www.youtube.com/embed/3OU8D8kBjWg" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>

     

     

     

        <div class="space3"></div>

     

        <div class="photospace1"></div>

        <div class="photo1"><a href="_images/kayaking_6lg.png"><img src="_images/kayaking_6.jpg" alt="Inland Empire Waterkeeper" width="176" height="95"></a></div>

        <div class="photospace2"></div>

        <div class="photo2"><a href="_images/riverkat_57lg.png"><img src="_images/riverkat_57.jpg" width="176" height="95" alt="Inland Empire Waterkeeper"></a></div>

        <div class="photospace3"></div>

        <div class="photo3"><a href="_images/riverkat_172lg.png"><img src="_images/riverkat_172.jpg" width="176" height="95" alt="Inland Empire Waterkeeper"></a></div>

        <div class="photospace4"></div>

     

        <div class="space4"></div>

     

     

     

      <div class="pillars"><img src="_images/pillars_grey.jpg" alt="Inland Empire Waterkeeper Pillars" width="933" height="400" border="0" usemap="#Map">

        <map name="Map" id="Map">

          <area shape="rect" coords="77,54,297,198" href="advocacy.html" alt="Inland Empire Waterkeeper Advocacy">

          <area shape="rect" coords="361,51,584,195" href="education.html" alt="Inland Empire Waterkeeper Education">

          <area shape="rect" coords="636,54,858,196" href="research.html" alt="Inland Empire Waterkeeper Research">

          <area shape="rect" coords="212,220,430,352" href="restoration.html" alt="Inland Empire Waterkeeper Restoration">

          <area shape="rect" coords="502,222,726,364" href="enforcement.html" alt="Inland Empire Waterkeeper Enforcement">

        </map>

      </div>

     

     

     

      <div class="footer"><img src="_images/footer2.png" width="933" height="100" alt="Inland Empire Waterkeeper"></div>

    </div>

     

    <script type="text/javascript">

    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});

    </script>

    </div>

    </body>

    </html>

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points