Two Divs on same line

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

    #1

    Two Divs on same line

    I'm trying to get two divs on the same line....the problem I have is
    when the browser window gets smaller, the second div is being pushed
    below the first div....I want them to stay on the same line. Here is
    my code:

    <div style="white-space:nowrap">
    <div style="float:le ft">
    Left Column
    </div>
    <div style="float:le ft;margin-left:10px">
    Right Column
    </div>
    </div>
  • David Stone

    #2
    Re: Two Divs on same line

    In article
    <4b6fdb6f-7f5f-4b13-8b77-333315f100c8@56 g2000hsm.google groups.com>,
    rcw1983 <rwiegel@gmail. comwrote:
    I'm trying to get two divs on the same line....the problem I have is
    when the browser window gets smaller, the second div is being pushed
    below the first div....I want them to stay on the same line. Here is
    my code:
    >
    <div style="white-space:nowrap">
    <div style="float:le ft">
    Left Column
    </div>
    <div style="float:le ft;margin-left:10px">
    Right Column
    </div>
    </div>
    Set a width of a bit less than 50% on each (to allow for
    a margin between the two), then float them left and right,
    respectively?

    Of course, if your users tend to use large default font sizes
    with very narrow windows, it will look ugly as all get out!

    Comment

    • Sherman Pendley

      #3
      Re: Two Divs on same line

      rcw1983 <rwiegel@gmail. comwrites:
      I'm trying to get two divs on the same line....the problem I have is
      when the browser window gets smaller, the second div is being pushed
      below the first div.
      Fluid layout is not a problem, it's a *solution* to the problem that web
      browser windows can change size.

      If you're looking for a format where everything is nailed firmly into place,
      PDF might be more appropriate.

      sherm--

      --
      My blog: http://shermspace.blogspot.com
      Cocoa programming in Perl: http://camelbones.sourceforge.net

      Comment

      • Andy Dingley

        #4
        Re: Two Divs on same line

        On 7 May, 15:21, rcw1983 <rwie...@gmail. comwrote:
        I'm trying to get two divs on the same line....the problem I have is
        when the browser window gets smaller, the second div is being pushed
        below the first div....I want them to stay on the same line.
        Then use a <table>

        If you _really_ want them to stay in their relative position,
        regardless of whether they still fit into the window, then <tableis
        the appropriate code to use.

        You could use position:absolu te as well, but that's even more
        restrictive and problematic.

        Comment

        • rcw1983

          #5
          Re: Two Divs on same line

          Thanks for the replies....

          Setting the divs to width of 50% won't work because once the content
          inside the divs gets to be wider than 50% of the browser window the
          divs again wrap.

          I am trying to use div's as an alternative to tables for Section 508
          compliance

          Sherman, you were a big help

          Comment

          • Andy Dingley

            #6
            Re: Two Divs on same line

            On Wed, 7 May 2008 09:15:46 -0700 (PDT), rcw1983 <rwiegel@gmail. com>
            wrote:
            >I am trying to use div's as an alternative to tables for Section 508
            >compliance
            Section 508 doesn't require you to avoid tables, only the inappropriate
            mis-use of tables.

            If you care about accessibility, go to a fluid design that re-arranges
            your boxes when they're too wide to both fit the window. This is
            probably the best solution all round.

            If you _must_ avoid the boxes re-arranging, even at the cost of
            scrolling, stick with the table. This isn't contrary to 508.

            Comment

            • rcw1983

              #7
              Re: Two Divs on same line

              Andy, thanks for the comments.....I don't know the exact reason my
              company has decided to avoid tables at all costs, they claim that even
              though it is technically compliant it is still more difficult for
              screen readers.....the y have created a company-wide rule that tables
              are to be used only for data.....I was trying to do this as divs for
              the sake of surviving a code review, but I might end up using tables
              anyways

              Our pages are split into 3 sections and I'm working with a narrow part
              of the screen....when the browser window is maximized its not a
              problem, but if the screen gets resized my content should not wrap to
              the next line and that seciton of the page should have
              scrollbars....t his is what they want....I think tables might be my
              best option

              Thanks

              Comment

              • David Stone

                #8
                Re: Two Divs on same line

                In article
                <55d77065-dbf7-4042-8c55-21f2e44073e3@f3 6g2000hsa.googl egroups.com>,
                rcw1983 <rwiegel@gmail. comwrote:
                Andy, thanks for the comments.....I don't know the exact reason my
                company has decided to avoid tables at all costs, they claim that even
                though it is technically compliant it is still more difficult for
                screen readers.....the y have created a company-wide rule that tables
                are to be used only for data.....I was trying to do this as divs for
                the sake of surviving a code review, but I might end up using tables
                anyways
                >
                Our pages are split into 3 sections and I'm working with a narrow part
                of the screen....when the browser window is maximized its not a
                problem, but if the screen gets resized my content should not wrap to
                the next line and that seciton of the page should have
                scrollbars....t his is what they want....I think tables might be my
                best option
                Can you not set min-width? Works in IE7, and there are JS routines
                to make it work in IE 6.

                Comment

                Working...