Skip navigation
Katelyn1994!
Currently Being Moderated

Dreamweaver CC Navigation Bar Problem

Sep 16, 2013 10:53 AM

Tags: #help #dreamweaver #cc #html_issue

I have just created a website with dreamweaver cc and now my navigation bar is not working correctly in Internet Explorer, but the website works in google chrome perfectly. The images are not on the same line and do not appear. My url is www.schuntingpreserve.com. I have already deleted the spaces between my words such as directions real.jpg to directionsreal.jpg and this did not help. If anyone thinks they might have a solution please comment.

 
Replies
  • Currently Being Moderated
    Sep 16, 2013 12:38 PM   in reply to Katelyn1994!

    Hi Katelyn -

     

    Your navigation images are not uploaded to the root folder on your server, or their file names do not match your link code. Also remember that most servers are case sensitive, so check for capitalization errors.

     

    Your page is taking forever to download even on my very high speed connections. You need to resize your large pictures in your graphics program to the approximate size you intend to display them on your page.

     

    Also Google search engines can not read text in images likesummarysummary.png

     
    |
    Mark as:
  • Currently Being Moderated
    Sep 16, 2013 1:22 PM   in reply to Katelyn1994!

    Further to what Ken Binney has said, you still have lots of errors on your page.  I have tried to clear some of them using %20 for spaces but this is not a permanent solution.  Also, <center>..</center> is not a valid html tag these days so you need to remove it complately.

     

    I suggest use this code for your first page and then see if it works or not:

     

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Website Page</title>
    <style type="text/css">
    body {
          margin-left: 0px;
          margin-top: 0px;
          margin-right: 0px;
          margin-bottom: 0px;
          background-color: #333333;
    }
    #Container {
          padding: 0px;
          height: auto;
          margin-right: auto;
          margin-left: auto;
          border-width: 0px;
          border-style: solid;
          background-color: #999999;
    }
    #Holder {
          padding: 0px;
          height: auto;
          width: 900px;
          margin-right: auto;
          margin-left: auto;
          border-width: 0px;
          border-style: solid;
    }
    #Header {
          padding: 0px;
          height: 350px;
          width: 900px;
          margin-right: auto;
          margin-left: auto;
          border-width: 0px;
          border-style: solid;
          background-color: #000000;
    }
    
    #NavBar {
          padding: 0;
          height: 32px;
          width: 900px;
          list-style:none;
          margins:0;
    
    }
    #MainContent {
          padding: 0px;
          height: 300px;
          width: 900px;
          margin-right: auto;
          margin-left: auto;
          border-width: 0px;
          border-style: solid;
          background-color: #FFFFFF;
    }
    
    #Photo {
          padding: 0px;
          width: 900px;
          margin-right: auto;
          margin-left: auto;
          border-width: 0px;
          border-style: solid;
          height: 50px;
          line-height: 0;
    }
    
    
    
    #Left {
          padding: 0px;
          float: left;
          height: 300px;
          width: 760px;
          border-width: 0px;
          border-style: solid;
          background-color: #000000;
    }
    
    #Right {
          padding: 0px;
          float: right;
          height: 300px;
          width: 140px;
          background-color: #333333;
    }
    
    #gallery {
          padding: 0px;
          height: 310px;
          width: 900px;
          margin-right: auto;
          margin-left: auto;
          border-width: 0px;
          border-style: solid;
          background-color: #000000;
    }
    #table_horz {
        width: 900px;
        height: 300px;
        overflow: auto;
    }
    
    
    
    #wrapper {
          background-image: url(My%20Site/Assets/3.jpg);
    }
    #Inside Right {
          height: 300px;
          width: 230px;
          background-color: #333333;
    }
    #Footer {
          height: 55px;
          width: auto;
          background-color: #333333;
    }
    </style>
    <script type="text/javascript">
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    </script>
    </head>
    
    <body onLoad="MM_preloadImages('RatesRealDealRoll.jpg','BookREalRoll.jpg','DirectionsRealRoll.jpg','ContactUSRealDEalRoll.jpg','homebutton2.png','homebutton2.jpg')">
    <div id="Container">
               <div id="wrapper">
                          <div id="Holder">
                                     <div id="Header">
                                                <p style="text-align:center;">
    
                                                                      <label><img src="My%20Site/Assets/logo.png" width="447" height="312"  alt=""/></label>
    
                                                </p>
                                     <a href="index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image13','','homebutton2.jpg',1)"><img src="Homebutton.jpg" alt="" width="180" height="50" id="Image13"></a><a href="RatesRealPage.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','RatesRealDealRoll.jpg',1)"><img src="RatesRealDeal.jpg" alt="" width="180" height="50" id="Image3"></a><a href="Book%20a%20hunt.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','BookREalRoll.jpg',1)"><img src="BookREal.jpg" alt="" width="180" height="50" id="Image4"></a><a href="Directions.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','DirectionsRealRoll.jpg',1)"><img src="DirectionsReal.jpg" alt="" width="180" height="50" id="Image5"></a><a href="Contact%20Us.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','ContactUSRealDEalRoll.jpg',1)"><img src="ContactUSRealDEal.jpg" alt="" width="180" height="50" id="Image7"></a></div>
                                     <div id="NavBar">
                                                </div>
    
                                     <div id="MainContent">
                                                <div id="Left"><img src="My%20Site/Assets/facebook%20dad3.png" width="266" height="300"  alt=""/><img src="My%20Site/Assets/summarysummary.png" width="471" height="297"  alt=""/></div>
                                                <div id="Right">
                                                           <div id="Inside">
                                                                      <p style="text-align:center;">
    
                                                                                            <label><img src="My%20Site/Assets/Established%20Poster!!!!!!!!!!!.png" width="103" height="111"  alt=""/></label></p><img src="My%20Site/Assets/inside%20stuff.png" width="140" height="66"  alt=""/><img src="My%20Site/Assets/footer.png" width="140" height="81"  alt=""/><p></p></div>
                                                </div>
                                     </div>
                                     <div id="Photo">
                                                <p style="text-align:center;">
    
                                                                      <label><img src="My%20Site/Assets/Photo%20Gallery%20Word%203.png"  alt="" width="300"
      height="49" /></label>
    
                                                </p>
                                     </div>
    <div id="gallery">
    <div id="table_horz">
    <img src="Background%20Picture%20for%20Website.jpg" width="380" height="300"  alt=""/>
    <img src="Sky.jpg" width="380" height="300"  alt=""/>
    <img src="Dad's%20Pics%201%20003.jpg" width="380" height="300"  alt=""/>
    <img src="Dad's%20Pics%201%20103.jpg" width="380" height="300"  alt=""/>
    <img src="Dad's%20Pics%201%20100.jpg" width="380" height="300"  alt=""/>
    <img src="Dad's%20Pics%201%20131.jpg" width="380" height="300"  alt=""/>
    <img src="pheasant_3.jpg" width="380" height="300"  alt=""/>
    <img src="Dad's%20Pics%201%20083.jpg" width="380" height="300"  alt=""/>
    <img src="Pics%20064.jpg" width="380" height="300"  alt=""/>
    <img src="quail_3.jpg" width="300" height="300"  alt=""/>
    <img src="facebook%20dad.JPG" width="400" height="300"  alt=""/>
    </div></div>
                                     </div>
                          </div>
                          <div id="Footer"><p style="text-align:center;">
                                     <label><img src="My%20Site/Assets/footer%202.png" width="246" height="51"  alt=""/></label></p>
                          </div>
    </div>
    
    </body>
    </html>

     

    When you have done it, upload a new file and post back so that CSS can then be checked and validated.

     

    Good luck.

     
    |
    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