Announcement

Collapse
No announcement yet.

Strange CSS Behaviour from Fireworks Menus?

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
    #1

    Strange CSS Behaviour from Fireworks Menus?

    Hi all,

    I decided to update my menus this week for Xmas, to add a lot more info quickly to the shopper so I implemented Fireworks excellent rollover behaviours and added some drop-down menus.

    Now, Fireworks builds the CSS in a separate file so I simply copied and pasted this below my site CSS and tested, lovely! Works fun (and here it comes!) but . . the nice Section Lists at the top of every section showing where customer is in store Shop>Airbrushes>Iwata>Airbrushes>HP-CH>etc has strangely taken on some of the CSS coding and returned every listing - 'Return' as in moved down to next paragraph line like below:

    Shop
    >Airbrushes
    >Iwata
    >Airbrushes
    >HP-CH
    >etc

    which has messed up the layout and I've had to switch them off!

    Here is the code fireworks created complete with my usual site CSS: http://www.organicimage.com/acatalog/aba_oi_08.css To make it easy to read, my original CSS ends, there are a few blank returns in the document and then the new Fireworks CSS begins with:


    td img {
    /* Another Mozilla/Netscape bug with making sure our images display correctly */
    display: block;

    Nothing else seems to have been effected by the additional CSS in my file, just the placement of the listings for the sections at the top of each section.

    Any help would be greatly appreciated as these listings are excellent for navigation in my opinion and I would like to have them back!

    Thank you . .

    Beej
    Organic Image - Award-winning Airbrush Kustom Art & Airbrush Classes
    Tags: None
    #2
    we're prolly going to need a viewable url, lest we be stabbing in the dark.

    Comment

      #3
      Originally posted by gabrielcrowe View Post
      we're prolly going to need a viewable url, lest we be stabbing in the dark.
      Not sure what you mean? I can click the URL and see it fine?

      Thanks

      Beej
      Organic Image - Award-winning Airbrush Kustom Art & Airbrush Classes

      Comment

        #4
        I think Gabe meant someplace where we can see the problem in action.

        Anyway, it sounds to me like there's probably some conflicting CSS styles that's formatting the breadcrumb links. You'll need to look at the styling you have on them and see if there's anything in the fireworks css that could be affecting them.

        Mike
        -----------------------------------------

        First Tackle - Fly Fishing and Game Angling

        -----------------------------------------

        Comment

          #5
          Originally posted by olderscot View Post
          I think Gabe meant someplace where we can see the problem in action.

          Anyway, it sounds to me like there's probably some conflicting CSS styles that's formatting the breadcrumb links. You'll need to look at the styling you have on them and see if there's anything in the fireworks css that could be affecting them.

          Mike
          OK, sorry Gabe

          Check a part of the site here then for example:

          http://www.organicimage.com/acatalog...shes_Mojo.html

          I am just uploading the site again as I type this and have added the site listings back so you can see.

          Thanks for any help you can give me

          Beej
          Organic Image - Award-winning Airbrush Kustom Art & Airbrush Classes

          Comment

            #6
            I get a javascript error on that page preloadImages is not defined.


            Bikster
            SellerDeck Designs and Responsive Themes

            Comment

              #7
              Originally posted by jont View Post
              I get a javascript error on that page preloadImages is not defined.
              Hi Jont,

              Oh . . here is the code:

              <BODY TEXT="NETQUOTEVAR:FGCOLOR" marginwidth="0" marginheight="0" leftmargin="0" topmargin="0" OnLoad="NETQUOTEVAR:ONLOAD;preloadImages('OI08_Members_Log-in_f2.jpg','OI08_Members_Area_f2.jpg', etc);" bgcolor="#08020e">

              is that wrong?

              Also, here is another page showing top lists returning in a row:

              http://www.organicimage.com/acatalog...Air_Paint.html

              Beej
              Organic Image - Award-winning Airbrush Kustom Art & Airbrush Classes

              Comment

                #8
                Hi,

                Just wondered if anyone had any idea on this weird CSS change please?

                Thanks
                Organic Image - Award-winning Airbrush Kustom Art & Airbrush Classes

                Comment

                  #9
                  It's hard to tell as your page HTML seems to be in a bit of a mess. It looks to me as if you've got duplicate javascript routines defined, and the actinic stylesheet apears to be linked way down the page in your content rather than the header.

                  Having said that, I see you have a section image separating your breadcrumbs and I wonder if this bit:

                  td img {
                  /* Another Mozilla/Netscape bug with making sure our images display correctly */
                  display: block;

                  might be forcing those images to wrap to new line. You could try commenting them out and see if that's the problem.

                  Mike
                  -----------------------------------------

                  First Tackle - Fly Fishing and Game Angling

                  -----------------------------------------

                  Comment

                    #10
                    Originally posted by olderscot View Post
                    It's hard to tell as your page HTML seems to be in a bit of a mess. It looks to me as if you've got duplicate javascript routines defined, and the actinic stylesheet apears to be linked way down the page in your content rather than the header.

                    Having said that, I see you have a section image separating your breadcrumbs and I wonder if this bit:

                    td img {
                    /* Another Mozilla/Netscape bug with making sure our images display correctly */
                    display: block;

                    might be forcing those images to wrap to new line. You could try commenting them out and see if that's the problem.

                    Mike
                    Hi Mike,

                    Thanks bud,

                    I have a couple of JS code snippets to clean out and the CSS is in the head but jus low down, so I'll move that up to the top.

                    But, you were bang on bud! I commented this code out:

                    td img {
                    /* Another Mozilla/Netscape bug with making sure our images display correctly */
                    display: block;

                    and sure enough, they all lined up again horizontally but the problem caused though was that the drop-down menu's that this additional CSS created, didn't line up anymore as they do now, they were all over he place!? They had all moved up higher nd inset themselves close to the left by few pixels very odd?

                    Any ideas how to overcome that?

                    Thanks bud.

                    Beej
                    Organic Image - Award-winning Airbrush Kustom Art & Airbrush Classes

                    Comment

                      #11
                      Actually I just realised whay I did:

                      I had done this:

                      */td img {
                      /* Another Mozilla/Netscape bug with making sure our images display correctly */
                      display: block;*/

                      Instead of this:

                      td img {
                      /* Another Mozilla/Netscape bug with making sure our images display correctly
                      display: block;*/



                      Thanks. Now it lines up again AND all the images are lining up horizontally! Job done.

                      Thank you . .

                      Beej
                      Organic Image - Award-winning Airbrush Kustom Art & Airbrush Classes

                      Comment

                        #12
                        I suspect you might be calling the css file in some of your other templates.

                        this clearly isn't right:

                        <BR>
                        <span class="actxsmall"></span>
                        <link rel="stylesheet" href="actinic.css" type="text/css">
                        <div align="center"><a name="sectiontop">
                        <A HREF="equipment.html"><SPAN CLASS="actxsmall"><I><B>Airbrush &#38; Art Shop</B></I></SPAN></A> &nbsp;
                        <img src="section_image.gif" width="16" height="16" align="absmiddle">&nbsp;
                        <A HREF="Airbrushes.html"><SPAN CLASS="actxsmall"><I><B>Airbrushes</B></I></SPAN></A> &nbsp;
                        <img src="section_image.gif" width="16" height="16" align="absmiddle">&nbsp; <SPAN CLASS="actxsmall"><B>Airbrushes Mojo</B></SPAN> </a><a name="sectiontop"> </a>
                        Mike
                        -----------------------------------------

                        First Tackle - Fly Fishing and Game Angling

                        -----------------------------------------

                        Comment

                        Previous template Next
                        Working...
                        X