6 Replies Latest reply on Oct 27, 2008 4:57 PM by ottz0

    Firefox not floating right

    ottz0 Level 1
      I have a 2 divs nested inside one another. left div float left and right div float right.

      This displays correctly in IE and all good ,however Firefox is not diplaying correctly.

      can someone please have a look and see where it's going wrong. Also A want the left nav BG to display all the way down but it stops where the content does.. I want it at 100%

      Thanks

      http://www.testing.discoverportstephens.com/
        • 1. Re: Firefox not floating right
          Level 7
          Start by fixing the coding errors:
          http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.testing.discoverportstephens. com%2F
          Especially this one: ID "lnav2marg" already defined

          --

          Walt


          "ottz0" <webforumsuser@macromedia.com> wrote in message
          news:ge3k8l$7jq$1@forums.macromedia.com...
          >I have a 2 divs nested inside one another. left div float left and right
          >div
          > float right.
          >
          > This displays correctly in IE and all good ,however Firefox is not
          > diplaying
          > correctly.
          >
          > can someone please have a look and see where it's going wrong. Also A want
          > the
          > left nav BG to display all the way down but it stops where the content
          > does.. I
          > want it at 100%
          >
          > Thanks
          >
          > http://www.testing.discoverportstephens.com/
          >


          • 2. Re: Firefox not floating right
            ottz0 Level 1
            Hi

            Thanks Walt. I have passed validation, but still the error. Any Ideas
            • 3. Re: Firefox not floating right
              Level 7
              ottz0 wrote:
              > Hi
              >
              > Thanks Walt. I have passed validation, but still the error. Any Ideas

              Alter your css for the elements as below (there's some subtle changes so
              make sure its exactly the same as written)


              .content {
              background-color:#FFFFFF;
              background-repeat: repeat-y;
              width:945px;
              border-right-width: 1px;
              border-right-style: solid;
              border-right-color: #CCCCCC;
              border-left-width: 1px;
              border-right-style: solid;
              border-left-style: solid;
              border-left-color: #CCCCCC;
              }


              .rcontent {
              margin:0px;
              float:right;
              width: 675px
              }

              .lnav{
              padding: 0;
              width:240px;
              color:#FFFFFF;
              float:left;
              background-image: url(images/main_bg.gif);
              background-repeat: repeat-y;
              }

              h1 {
              font-family:Arial, Helvetica, Geneva, sans-serif;
              font-size:21px;
              font-weight:bold;
              color:#1D495C;
              margin: 0;
              padding: 0;
              }
              • 4. Re: Firefox not floating right
                Level 7
                ottz0 wrote:
                Also A want the
                > left nav BG to display all the way down but it stops where the content does.. I
                > want it at 100%

                The left lnav bg you'll have to attach to the .content <div> css as this
                is the <div> that wraps both the lnav and rcontent <divs> and governs
                the height of the page design.

                You'll most likely need to use a 'clearing' the floats method to force
                the .content <div> to wrap around the other two <div> which are floated
                left and right. You can do this by adding:

                overflow: hidden; to the .content css

                If you do not do this you will not see the bg image once its been
                attached to the .content css.

                Make the changes I suggest in my other reply first to get the page
                layout correct, then come back and implement the bg image solution.
                • 5. Re: Firefox not floating right
                  Level 7
                  On Mon, 27 Oct 2008 06:56:33 +0000 (UTC), "ottz0"
                  <webforumsuser@macromedia.com> wrote:

                  >Hi
                  >
                  >Thanks Walt. I have passed validation, but still the error. Any Ideas

                  You float your rcontent class, but you never assign a width to it.
                  Give it a width of 660 or less and it will float the way you want.

                  Gary
                  • 6. Re: Firefox not floating right
                    ottz0 Level 1
                    Osgood

                    Thanks heaps that has fixed all solution. It a bit easy to get lost sometimes.

                    The only thing now in Firefox is that the grey border around the content is missing and this displays in IE. Also in Firefox the BG image was showing so I set the rcontent to white. That fixed that but now the grey borders.

                    Any ideas

                    Thanks for your help