Centering middle cell, code included.

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • luke
    #1

    Centering middle cell, code included.

    I need to have two different backgrounds, one on the left and one on the
    right of the screen, with the main content centered in the browser. This is
    the code I have come up with

    <table border="0" cellpadding="0" cellspacing="0" width="100%">
    <tr>
    <td width="49%" background="lef t.gif"><img src="shim.gif" alt=""
    height="1" width="1"></td>
    <td width="2%" valign="top"> ALL CONTENT </td>
    <td width="49%" background="rig ht.gif"><img src="shim.gif" alt=""
    height="1" width="1"></td>
    </tr>
    </table>

    This seems to work perfectly, however I'm slighlty unsure as the numbers
    don't add up. Say my Content in the middle cell is a 750 pixel wide nested
    table, this would obviously mean that the percentage are not as described.
    Is there a chance that certain browsers will choke on this code? and maybe
    not display the middle cell in the middle of the page?


    Tags: None
    • Kris
      #2
      Re: Centering middle cell, code included.

      In article <cl695d$qce$1@n ewsg4.svr.pol.c o.uk>,
      "luke" <lukenomailt@no emailspam.com> wrote:
      [color=blue]
      > I need to have two different backgrounds, one on the left and one on the
      > right of the screen, with the main content centered in the browser. This is
      > the code I have come up with
      >
      > <table border="0" cellpadding="0" cellspacing="0" width="100%">
      > <tr>
      > <td width="49%" background="lef t.gif"><img src="shim.gif" alt=""
      > height="1" width="1"></td>
      > <td width="2%" valign="top"> ALL CONTENT </td>
      > <td width="49%" background="rig ht.gif"><img src="shim.gif" alt=""
      > height="1" width="1"></td>
      > </tr>
      > </table>
      >
      > This seems to work perfectly, however I'm slighlty unsure as the numbers
      > don't add up. Say my Content in the middle cell is a 750 pixel wide nested
      > table, this would obviously mean that the percentage are not as described.
      > Is there a chance that certain browsers will choke on this code? and maybe
      > not display the middle cell in the middle of the page?[/color]

      Wait, you mean, all that when this will do?

      CSS:
      body {
      color: #000;
      background: url("750pxwideg reenblock.png") #0000cc repeat-y;
      text-align: center;
      }
      #content {
      width: 750px;
      margin: 0 auto;
      text-align: left;
      color: #000;
      background: green;
      }

      HTML:
      <body>
      <div id="content">
      Whatever content you have.
      </div>
      </body>

      --
      Kris
      <kristiaan@xs4a ll.netherlands> (nl)

        Comment

        • luke
          #3
          Re: Centering middle cell, code included.

          "Kris" <kristiaan@xs4a ll.netherlands> wrote in message
          news:kristiaan-CF6041.20064320 102004@news1.ne ws.xs4all.nl...
          [color=blue]
          >
          > Wait, you mean, all that when this will do?[/color]

          Wait, I think you misread my post!


            Comment

            • Kris
              #4
              Re: Centering middle cell, code included.

              In article <cl6aqo$vc6$1@n ews5.svr.pol.co .uk>,
              "luke" <lukenomailt@no emailspam.com> wrote:
              [color=blue][color=green]
              > > Wait, you mean, all that when this will do?[/color]
              >
              > Wait, I think you misread my post![/color]

              Maybe. So now what?

              --
              Kris
              <kristiaan@xs4a ll.netherlands> (nl)

                Comment

                • jmm-list-gn
                  #5
                  Re: Centering middle cell, code included.

                  luke wrote:[color=blue]
                  > <td width="49%" background="lef t.gif"><img src="shim.gif" alt=""
                  > <td width="2%" valign="top"> ALL CONTENT </td>
                  > <td width="49%" background="rig ht.gif"><img src="shim.gif" alt=""
                  > This seems to work perfectly, however I'm slighlty unsure as the numbers
                  > don't add up.
                  >[/color]
                  My math says that 49 + 2 + 49 = 100. Seems to add up.
                  [color=blue]
                  > Say my Content in the middle cell is a 750 pixel wide nested
                  > table, this would obviously mean that the percentage are not as described.
                  >[/color]
                  Why do you care? You already ignore the percentages to get an
                  expandable middle section. If the total image widths exceed the viewable
                  area, the table expands beyond the view.
                  You'd have to view the result with different browsers to verify how
                  they handle it.

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

                    Comment

                    • Robert Frost-Bridges
                      #6
                      Re: Centering middle cell, code included.

                      luke wrote:
                      [color=blue]
                      > I need to have two different backgrounds, one on the left and one on
                      > the right of the screen, with the main content centered in the
                      > browser. This is the code I have come up with[/color]

                      Join the two backgrounds together using a graphics program then use
                      Kris' example with this single background.

                      --
                      frostie
                      Brighton 2025 - A Fixed Odds League
                      http://brightonfixedodds.net

                        Comment

                        Previous template Next
                        Working...