#1
  1. No Profile Picture
    Super Moderator
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Jun 2009
    Location
    Hartford, WI
    Posts
    1,494
    Rep Power
    111

    Make a center element recognize a fixed


    Well, I've the months being defined and center just fine, and a "status"-like DIV fixed at top-left. When in full-screen, it will display just fine. What I am aiming for is, as you lessen the screen size, the months to remain centered until they collide with the "status" DIV. I want the user to be able to continue to lessen the screen size, but have the centered months stop once hitting the fix DIV, and allow the spacing at right to continue to lessen. Is this simply possible?

    Current CSS on the 2 elements:
    Code:
    #balance {
      position: fixed;
      left: 20px;
      top: 20px;
    }
    #invoice DIV.table {
      display: table;
      margin: 0 auto;
    }
    (#invoice is a straight DIV w/ no added definitions)

    Full HTML:
    PHP Code:
    <BODY>
      <DIV id="balance">
        <B>Open accounts and any items to be PAID OFF</B><BR />
        <TABLE>
          <TBODY>
            <TR><TD>Item<TD>Total Due/Limit<TD>As of...
    <?= build_current_balance($year); ?>
          </TBODY>
        </TABLE>
        <BR /><BR /><B><?= $year?> Actions w/ <?= $year 1?> Tax Returns</B><BR />
        <TABLE>
          <TBODY>
            <TR><TD>Item<TD>Due/Limit<TD>As of...
    <?= build_returns_balance($year); ?>
          </TBODY>
        </TABLE>
      </DIV>
      <DIV id="invoice">
        <DIV class="table">
    <?php if(isset($_GET['edit']) && $_GET['edit']) { ?>
          <FORM class="tr">
            <SPAN class="td">Paid<BR /><INPUT name="paid" type="checkbox" /></SPAN>
            <SPAN class="td">Due<BR /><INPUT name="due" placeholder="01" /></SPAN>
            <SPAN class="td">Amount<BR /><INPUT name="value" placeholder="0.00" /></SPAN>
            <SPAN class="td">
              Account<BR />
    <?= build_account_select(); ?>
            </SPAN>
            <SPAN class="td">Adjusted<BR /><INPUT name="adj_value" /></SPAN>
            <SPAN class="td">Comment<BR /><INPUT name="comment" /></SPAN>
            <SPAN class="action td"><IMG class="add" src="./img/add.png" /></SPAN>
          </FORM>
    <?php ?>
    <?= build_invoice
    ($year); ?>
        </DIV>
      </DIV>
    </BODY>
    Last edited by Triple_Nothing; August 8th, 2017 at 02:26 PM.
    He who knows not that he knows not is a fool, ignore him. He who knows that he knows not is ignorant, teach him. He who knows not that he knows is asleep, awaken him. He who knows that he knows is a leader, follow him.

IMN logo majestic logo threadwatch logo seochat tools logo