Announcement

Collapse
No announcement yet.

Top Level Section List Does Not display Correctly in Internet Explorer

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Top Level Section List Does Not display Correctly in Internet Explorer

    Hi, yes it's me again!

    I am nearly ready to upload my store but I have got a problem with the Top Level Section List and Brochure Navbar in that they don't display correctly in Internet Explorer V. 7. The menus display ok in the latest versions of Firefox and Netscape. If you look at my site in IE V. 7, you will see an annoying white space along the right hand side of the 2 menus which I want to get rid of. Does anybody have any ideas as to why they aren't displaying properly?


    The Top Level Section List and Brochure Navbar both sit within my Outer Layout which has been created in DW.

    Thanks
    Jules

    #2
    Im guessing at block level elements with widths specified rather than allowing to fill the parent. This could be well off the mark though as deciphering the code and looking up the CSS is a pain. How's about you illustrate to us how it is setup and show us the styles applied to it and take the hard bit out of it for us. We can then provide you with the easy solution.

    Comment


      #3
      It looks a bit odd in ie6 as well to be honest. Also you have two home page links that go to different pages.

      Can you describe what the page/navigation should look like as I can see two instances of horrizontal navigation

      Comment


        #4
        ok, thanks for the replies.

        Im guessing at block level elements with widths specified rather than allowing to fill the parent.
        Lee, I'm not entirely sure I understand what you mean. Are you saying that there is not enough width for the menu to display correctly?

        This could be well off the mark though as deciphering the code and looking up the CSS is a pain. How's about you illustrate to us how it is setup and show us the styles applied to it and take the hard bit out of it for us. We can then provide you with the easy solution
        Now, that is a very good question! To be honest, I am pretty new to this and I am learning as I go along. Would it help if I attached the CSS stylesheet I have used in my outer layout created in DW?


        Malcolm,

        It looks a bit odd in ie6 as well to be honest. Also you have two home page links that go to different pages.

        Can you describe what the page/navigation should look like as I can see two instances of horrizontal navigation

        Ok, my main site (non-Actinic) already had the larger horizontal navigation bar along the top. So, the idea is that once the customer clicks on the shop link from my main site, they will be taken to the page that you have just been looking at (i.e. the 'Shop Homepage'). Hence, the reason why there are 2 links to home is that the one named 'Home' takes the customer back to the main website homepage and the one titled 'Shop Home' takes the customer back to the shop homepage.

        What you can see is correct. I am sensing that you don't like my idea

        well I am new to this so perhaps you can let me off!

        I have attached 2 screenshots. In IE the menus on the left look rubbish. The white gap should not be there. The Firefox one looks ok.

        Also, when I upload in full production mode the shop homepage displays with the correct text size. For some reason, when I run it in test mode the text goes small. Most odd.

        I hope that helps.
        Attached Files
        Jules

        Comment


          #5
          I am sensing that you don't like my idea
          Its your site so you can do what you want - Im just looking at it from the view of someone who has seen it for the first time and I find it a little confusing to be honest.

          Comment


            #6
            Originally posted by JulesRS
            Lee, I'm not entirely sure I understand what you mean. Are you saying that there is not enough width for the menu to display correctly?

            Now, that is a very good question! To be honest, I am pretty new to this and I am learning as I go along. Would it help if I attached the CSS stylesheet I have used in my outer layout created in DW?
            I'm guessing at widths being specified somewhere, on what though it is hard to tell to be honest, without knowing what you have done.

            We do not need to see all of the stylesheet, just the particular styles used to style that area of your site. Maybe a good starting point would be to know how you included the list, what you used and how you have styled it if anything.

            Comment


              #7
              Its the css I suspect as duncan suggests - have you tried going to production mode as it may just sort itself out as you mention that the text is playing up as well. Pick a quiet time and upload to see what happens - you can always put the current site back up.

              Comment


                #8
                Hmmm im confused too, i can't get into the shop.

                I'd suggest keeping things as people would expect it to be. By all means be 'ground breaking' on design, but never on navigation - keep it simple!

                Comment


                  #9
                  I've had exactly this problem on a site since October last! It has something to do with the fact that its a block element and Firefox and IE transpose it differently. All connected with the padding I presume.

                  See http://www.turnerrichards.co.uk/acat...ry_Sticks.html

                  For whatever reason, I always find myself in a bit of a pickle with Actinic.css, but not with other sites I build. I think the reason for this is that some elements of colour are linked to more than one instance and this creates a problem.

                  If someone can give a definitive way to attack actinic.css, please feel free to do so

                  David
                  -----------------------------
                  www.synchronisedwebdesign.com
                  Location: North Yorkshire UK

                  Comment


                    #10
                    Ok, I appreciate your points.

                    Maybe a good starting point would be to know how you included the list, what you used and how you have styled it if anything.
                    I just inserted Actinic content into the DW template. The only CSS I can see around this is 'Style 26' Sorry to be vague but I can't see anything else in the code around this.

                    Its the css I suspect as duncan suggests - have you tried going to production mode as it may just sort itself out as you mention that the text is playing up as well. Pick a quiet time and upload to see what happens - you can always put the current site back up.

                    duncan? where is duncan? Yes, I will try that over the w/e.


                    Hmmm im confused too, i can't get into the shop.

                    I'd suggest keeping things as people would expect it to be. By all means be 'ground breaking' on design, but never on navigation - keep it simple!

                    Ok, the reason you can't get into the shop from the main site is that the main site is live and the shop is not...yet. The reason the link is not enabled from the main site is that I don't want people to be able to access it until the shop is open.

                    Does that mean you think my design is 'ground breaking' then Lee?


                    I've had exactly this problem on a site since October last! It has something to do with the fact that its a block element and Firefox and IE transpose it differently. All connected with the padding I presume.
                    Well, at least it's not just me then.
                    Jules

                    Comment


                      #11
                      Padding needs to be set to '0' on the parent element, and no widths specified on the block level elements so that they expand the full width of the parent. No Margins or padding on the <li> elements either, style the 'li a' instead.

                      It may be as easy as adding:

                      display: block; to the <li> style

                      although i'm guessing as i haven't seen this before.

                      Comment


                        #12
                        sorry Lee but I am a bit confused. Where exactly would I check this? Within Actinic or DW template?

                        Thanks
                        Jules

                        Comment


                          #13
                          Jules, select a different top level section layout to see what happens.

                          Style26 will be some styling you have added and it will be evident in the head area on the page. Create a new style with the same styling as the style26 class and then apply the new class to the area currently using style26. Once you have done this, remove the style26 declaration from the code.

                          Comment


                            #14
                            Originally posted by JulesRS
                            sorry Lee but I am a bit confused. Where exactly would I check this? Within Actinic or DW template?

                            Thanks
                            Sorry Jules, i was talking to David in web language. Im just gonna get stuck into my sticky toffee pudding, hopefully i get brave enough to dissect the code and styling for you after.

                            Comment


                              #15
                              Lee,

                              I've just tried what you suggested. I tried the 'Top Level Section List With Horizontal Dividers' and 'Standard Top Level Section List' and these appear fine in IE. So, the problem seems to be just with the 'Top Level Section List in Boxes'. Trust me to choose this one!

                              I also tried the creating a new style but it doesn't seem to have done anything.

                              Enjoy your sticky toffee pudding!
                              Jules

                              Comment

                              Working...
                              X