How do I stop "floats" from floating

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • donpro

    How do I stop "floats" from floating

    Hi,

    I have a row of 5 <DIVelements that have the "float: left" attribute
    as I wanted them on the same row. I issue a "clear: left" for the
    subsequent element.

    All looks great except if I increase the browser text size of contract
    the screen, the last DIV floats underneath. Is there anyway to stop
    this and keep all on the same row?

    Thanks,
    Don
  • Gregor Kofler

    #2
    Re: How do I stop &quot;floats&qu ot; from floating

    donpro meinte:
    Hi,
    >
    I have a row of 5 <DIVelements that have the "float: left" attribute
    as I wanted them on the same row. I issue a "clear: left" for the
    subsequent element.
    >
    All looks great except if I increase the browser text size of contract
    the screen, the last DIV floats underneath. Is there anyway to stop
    this and keep all on the same row?
    Not really. Since the observed "phenomenon " is how floats work. Perhaps
    you can enlarge the container containing the floats (or scale it in
    "em", too).

    Gregor


    --
    http://photo.gregorkofler.at ::: Landschafts- und Reisefotografie
    http://web.gregorkofler.com ::: meine JS-Spielwiese
    http://www.image2d.com ::: Bildagentur für den alpinen Raum

    Comment

    • Jim Moe

      #3
      Re: How do I stop &quot;floats&qu ot; from floating

      On 05/27/08 08:15 am, donpro wrote:
      >
      I have a row of 5 <DIVelements that have the "float: left" attribute
      as I wanted them on the same row. I issue a "clear: left" for the
      subsequent element.
      >
      All looks great except if I increase the browser text size of contract
      the screen, the last DIV floats underneath. Is there anyway to stop
      this and keep all on the same row?
      >
      Wrap them in another div of a fixed width set with ems.

      --
      jmm (hyphen) list (at) sohnen-moe (dot) com
      (Remove .AXSPAMGN for email)

      Comment

      • Andy Dingley

        #4
        Re: How do I stop &quot;floats&qu ot; from floating

        On 27 May, 16:15, donpro <donpro-2...@rogers.com wrote:
        All looks great except if I increase the browser text size of contract
        the screen, the last DIV floats underneath. Is there anyway to stop
        this and keep all on the same row?
        This is what float does. If you want to force the grid positioning,
        even when it no longer fits into the window size, then use a <table>
        instead.

        Read http://brainjar.com/css/positioning/ for a good article of float
        too.

        Comment

        • Bergamot

          #5
          Re: How do I stop &quot;floats&qu ot; from floating

          Jim Moe wrote:
          On 05/27/08 08:15 am, donpro wrote:
          >>
          >I have a row of 5 <DIVelements that have the "float: left" attribute
          >as I wanted them on the same row.
          >>
          Wrap them in another div of a fixed width set with ems.
          FYI, ems are not a one-size-fits-all unit.

          It wouldn't be the best unit to use unless the content were all text,
          and it's debatable even then. % units would allow the widths to scale to
          the window size, and px should be used for graphical content.

          The best unit to use depends on the specific content and the overall
          design/layout.

          If the OP posted a URL it would be easier to make a suggestion for his
          particular case.

          --
          Berg

          Comment

          • Roy A.

            #6
            Re: How do I stop &quot;floats&qu ot; from floating

            On 28 Mai, 17:48, Bergamot <berga...@visi. comwrote:
            Jim Moe wrote:
            On 05/27/08 08:15 am, donpro wrote:
            >
            I have a row of 5 <DIVelements that have the "float: left" attribute
            as I wanted them on the same row.
            >
              Wrap them in another div of a fixed width set with ems.
            >
            FYI, ems are not a one-size-fits-all unit.
            So use Inch, inch is a one-size-fits-all unit. On normal screens
            an inch is the same or a little bigger than one inch. It depends
            on your configuration. On a cellurar phone or a pda, an inch is
            not an inch, but something that looks like an inch (considering
            that you are holding the device closer to your eyes, and con-
            sidering that the letters has to be at least 8-9 pixels height). It
            would be different from device to device. But the idea isn't mine.
            Teoretical the graphical would match the letters, but that would
            never happen.
            >
            It wouldn't be the best unit to use unless the content were all text,
            and it's debatable even then. % units would allow the widths to scale to
            the window size, and px should be used for graphical content.
            How come? Isn't that defined in css? I would think that 100% is 100%
            of the containing element. So how would that differ?
            >
            The best unit to use depends on the specific content and the overall
            design/layout.
            I think most can agree with that.
            >
            If the OP posted a URL it would be easier to make a suggestion for his
            particular case.
            If the OP postet an URL, we all could use ower effort to criticise the
            content.
            That would be nice.

            Comment

            • Roy A.

              #7
              Re: How do I stop &quot;floats&qu ot; from floating

              On 28 Mai, 11:48, Andy Dingley <ding...@codesm iths.comwrote:
              On 27 May, 16:15, donpro <donpro-2...@rogers.com wrote:
              >
              All looks great except if I increase the browser text size of contract
              the screen, the last DIV floats underneath.  Is there anyway to stop
              this and keep all on the same row?
              >
              This is what float does. If you want to force the grid positioning,
              even when it no longer fits into the window size, then use a <table>
              instead.
              For once I agree with Andy Dingley. If you want a table layout, use
              tables. In most cases thats better than emulatin tables with div-
              elements.
              Don't rely on lynx or text-emulation if you are trying to design
              accessible
              sites. Most, and every "disabled" person is using a screen reader on
              top
              of an ordinary webbrowser. It can't be that hard to download and try
              out
              one for yourself. If you've tryed one, you know that now one is
              tabbing around
              and hope for some interesting to appear.
              >
              Readhttp://brainjar.com/css/positioning/for a good article of float
              too.
              Also remember, its's considered best practice to read htmldog.com.

              Comment

              • Jim Moe

                #8
                Re: How do I stop &quot;floats&qu ot; from floating

                On 05/28/08 08:48 am, Bergamot wrote:
                >>>
                >>I have a row of 5 <DIVelements that have the "float: left" attribute
                >>as I wanted them on the same row.
                >>>
                > Wrap them in another div of a fixed width set with ems.
                >
                FYI, ems are not a one-size-fits-all unit.
                >
                The OP mentioned changing the text size and having the layout degrade. I
                assumed he has text in the divs making ems an appropriate unit to recommend.

                --
                jmm (hyphen) list (at) sohnen-moe (dot) com
                (Remove .AXSPAMGN for email)

                Comment

                • Bergamot

                  #9
                  Re: How do I stop &quot;floats&qu ot; from floating


                  Jim Moe wrote:
                  On 05/28/08 08:48 am, Bergamot wrote:
                  >>>>
                  >>>I have a row of 5 <DIVelements that have the "float: left" attribute
                  >>>as I wanted them on the same row.
                  >>>>
                  >> Wrap them in another div of a fixed width set with ems.
                  >>
                  >FYI, ems are not a one-size-fits-all unit.
                  >>
                  The OP mentioned changing the text size and having the layout degrade. I
                  assumed he has text in the divs making ems an appropriate unit to recommend.
                  I guess I missed that part, but it doesn't change the fact that a fixed
                  width in ems may not be the best thing to do. It depends on the content.

                  There's another thread in here someplace about a layout with a fixed
                  width of 60ems. Bad, bad idea, except for people using small default
                  font sizes.

                  --
                  Berg

                  Comment

                  • John Hosking

                    #10
                    Re: How do I stop &quot;floats&qu ot; from floating

                    Roy A. wrote:
                    On 28 Mai, 11:48, Andy Dingley wrote:
                    >
                    >Readhttp://brainjar.com/css/positioning/for a good article of float
                    >too.
                    >
                    Also remember, its's considered best practice to read htmldog.com.
                    That's kind of an overstatement, isn't it?

                    You make it sound like it overshadows the Bible and Koran.

                    --
                    John
                    "And now, my children, let us turn to the Book of Margins, chapter 2,
                    verse 1."

                    Comment

                    • Blinky the Shark

                      #11
                      Re: How do I stop &quot;floats&qu ot; from floating

                      John Hosking wrote:
                      Roy A. wrote:
                      >On 28 Mai, 11:48, Andy Dingley wrote:
                      >
                      >>
                      >>Readhttp://brainjar.com/css/positioning/for a good article of float
                      >>too.
                      >>
                      >Also remember, its's considered best practice to read htmldog.com.
                      >
                      That's kind of an overstatement, isn't it?
                      >
                      You make it sound like it overshadows the Bible and Koran.
                      How so? To me it looks like a recommendation to learn about some
                      technical issues at a website.


                      --
                      Blinky
                      Killing all posts from Google Groups
                      The Usenet Improvement Project -- http://improve-usenet.org
                      Found 5/08: a free GG-blocking news *feed* -- http://usenet4all.se

                      Comment

                      • Gregor Kofler

                        #12
                        Re: How do I stop &quot;floats&qu ot; from floating

                        Roy A. meinte:
                        Also remember, its's considered best practice to read htmldog.com.
                        It is? Despite doing web authoring for quite some time now, I haven't
                        even heard of that site.

                        Gregor


                        --
                        http://photo.gregorkofler.at ::: Landschafts- und Reisefotografie
                        http://web.gregorkofler.com ::: meine JS-Spielwiese
                        http://www.image2d.com ::: Bildagentur für den alpinen Raum

                        Comment

                        • John Hosking

                          #13
                          Re: How do I stop &quot;floats&qu ot; from floating

                          Blinky the Shark wrote:
                          John Hosking wrote:
                          >
                          >Roy A. wrote:
                          >>On 28 Mai, 11:48, Andy Dingley wrote:
                          >>>Readhttp://brainjar.com/css/positioning/for a good article of float
                          >>>too.
                          >>Also remember, its's considered best practice to read htmldog.com.
                          >That's kind of an overstatement, isn't it?
                          >>
                          >You make it sound like it overshadows the Bible and Koran.
                          >
                          How so? To me it looks like a recommendation to learn about some
                          technical issues at a website.
                          >
                          Yeah, sure, that's understood, but: *best* practice?

                          It's better than any other tutorial or discussion site, better than
                          referring to the W3C's pages, better than
                          trial-and-error-and-validate-experimentation , better than these here
                          newsgroup thingies, better than thinking globally and acting locally,
                          better than treating others as you would have them treat you (etc.)?

                          If he had said "it's good practice" in the three places he's dropped
                          this phrase lately, I wouldn't have wasted the post on it. I *agree*
                          with *that* .

                          --
                          John
                          Better even than the UIP: http://improve-usenet.org/ ? ;-)

                          Comment

                          • Blinky the Shark

                            #14
                            Re: How do I stop &quot;floats&qu ot; from floating

                            John Hosking wrote:
                            Blinky the Shark wrote:
                            >John Hosking wrote:
                            >>
                            >>Roy A. wrote:
                            >>>On 28 Mai, 11:48, Andy Dingley wrote:
                            >>>>Readhttp://brainjar.com/css/positioning/for a good article of float
                            >>>>too.
                            >>>Also remember, its's considered best practice to read htmldog.com.
                            >>That's kind of an overstatement, isn't it?
                            >>>
                            >>You make it sound like it overshadows the Bible and Koran.
                            >>
                            >How so? To me it looks like a recommendation to learn about some
                            >technical issues at a website.
                            >
                            Yeah, sure, that's understood, but: *best* practice?
                            So is not using tables for nontabular material. That hardly ranks the
                            advice up with the relious canons. Canona. Canonae. Whatever.
                            It's better than any other tutorial or discussion site, better than
                            referring to the W3C's pages, better than
                            trial-and-error-and-validate-experimentation , better than these here
                            newsgroup thingies, better than thinking globally and acting locally,
                            better than treating others as you would have them treat you (etc.)?
                            Then it sounds like "best practice" to me.
                            If he had said "it's good practice" in the three places he's dropped
                            this phrase lately, I wouldn't have wasted the post on it. I *agree*
                            with *that* .
                            I see you didn't recommend anything better. So I guess "best" still works.



                            --
                            Blinky
                            Killing all posts from Google Groups
                            The Usenet Improvement Project -- http://improve-usenet.org
                            Found 5/08: a free GG-blocking news *feed* -- http://usenet4all.se

                            Comment

                            Working...