#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Posts
    3
    Rep Power
    0

    Design Breaks in IE7 and Links don't work in Firefox


    Hi. I am thinking my two problems are related!

    Here are my two problems:
    My top nav bar links don't work in Firefox and the design breaks in IE7.

    Any help would be much appreciated! I have validated it, and I know the slider and video don't validate, but I still have these problems even when I take those out. Thanks so much for any help you can provide!

    christthesavior.org


    Thank you!!!
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Welcome to DevShed Forums, jnightingale.

    The only problem I see in IE7 is that there is a white gap on the right side of the blue nav menu in the sidebar. Is there a bigger problem that I'm missing?

    What links? I don't see any links in the top nav bar. I see <div>s and <span>s that seem to have some JavaScript onclick event handlers. I'll other words, that is not how navigational menus should be coded. They should consist of a <ul> (unordered list) and <li>s (list-items) with an <a> (anchor/link) inside each <li>. If you want to place some <span>s inside the <a>s, that's ok too.

    If DotNetNuke can't generate proper navigational menus, I would strongly recommend you find a CMS (content management system) that can.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Posts
    3
    Rep Power
    0
    Thank you for responding. The problem in IE7 is that the slide show doesn't stay put, and there is about 3 inches of white space where it should be.

    The top nav bar is put together the way you mentioned - it just isn't working correctly - I think it has something to do with the way the logo is positioned. This is the code:

    <div id="topnav">
    <ul class="topnav">
    <li><a href="index.html">HOME</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;||&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </li>
    <li><a href="aboutus.html">ABOUT US</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;||&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
    <li><a href="admissions.html">ADMISSIONS</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;||&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
    <li><a href="curriculum.html">CURRICULUM</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;||&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
    <li><a href="calendar.html">CALENDAR</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;||&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
    <li><a href="faculty.html">FACULTY</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;||&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</li>
    <li><a href="contactus.html">CONTACT US</a></li>
    </ul>

    Thank you.
  6. #4
  7. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    We seem to be looking at different pages then. I'm looking at http://christthesavior.org/ where the top nav is this mess (extracted with Firebug):
    Code:
    <div class="menuTop">
    				<span><span id="dnn_dnnNAV_ctldnnNAV" class="mainMenu" tabindex="0" style="-moz-user-select: none;"><span id="dnn_dnnNAV_ctldnnNAVctr61" class=" sel  bc mi mi0 id61 root first"><span class="icn  "></span><span id="dnn_dnnNAV_ctldnnNAVt61" class="txt" style="cursor: pointer;">Home</span></span><span id="dnn_dnnNAV_ctldnnNAVctr65" class=" mi mi1 id65 root"><span class="icn  "></span><span id="dnn_dnnNAV_ctldnnNAVt65" class="txt" style="cursor: pointer;">About Us</span></span><span id="dnn_dnnNAV_ctldnnNAVctr66" class=" mi mi2 id66 root"><span class="icn  "></span><span id="dnn_dnnNAV_ctldnnNAVt66" class="txt" style="cursor: pointer;">Adults</span></span><span id="dnn_dnnNAV_ctldnnNAVctr67" class=" mi mi3 id67 root"><span class="icn  "></span><span id="dnn_dnnNAV_ctldnnNAVt67" class="txt" style="cursor: pointer;">Children</span></span><span id="dnn_dnnNAV_ctldnnNAVctr68" class=" mi mi4 id68 root"><span class="icn  "></span><span id="dnn_dnnNAV_ctldnnNAVt68" class="txt" style="cursor: pointer;">Youth</span></span><span id="dnn_dnnNAV_ctldnnNAVctr69" class=" mi mi5 id69 root"><span class="icn  "></span><span id="dnn_dnnNAV_ctldnnNAVt69" class="txt" style="cursor: pointer;">Blog</span></span><span id="dnn_dnnNAV_ctldnnNAVctr70" class=" mi mi6 id70 root last"><span class="icn  "></span><span id="dnn_dnnNAV_ctldnnNAVt70" class="txt" style="cursor: pointer;">Contact</span></span></span></span>
    			</div>
    The slideshow is working fine in IE7 in the page I'm looking at.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Posts
    3
    Rep Power
    0
    I am a real idiot. I am so sorry - that is not my site. Mine is
    christthesavioracademy.org.

    But, I finally got it fixed!

    Thank you again!!
  10. #6
  11. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Ah. I see. Did you forget to add links to the footer of your site?

    By the way, it's better to use CSS instead of lots of non-breaking spaces ("&nbsp;").
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).

IMN logo majestic logo threadwatch logo seochat tools logo