Why isn't my DIV and Form centering?

burnedfaceless
burnedfaceless used Ask the Experts™
on
If you check my css file I have
margin: auto;

Open in new window

for both form and divider-center. Why then is an invalid submission (like 126, 162, 6.9) rendering with the elements floating to the left?
index.html
form-generator.js
normalize.css
process.php
styles.css
Screen-Shot-2017-04-07-at-8.52.39-PM.png
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Distinguished Expert 2017
Commented:
As I see when you generate the form the js function create a form with submit button.After submit a second php function (generate_form) creates a second form. At this form the css styles didn't apply. I think that you must re-apply the css file at the top of the php file like that.
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title><?php echo $title;?></title>
  <link rel="stylesheet" href="normalize.css">
  <link rel="stylesheet" href="styles.css">
</head>
<body>
<!--start the php code from here to have the css properies-->

<?php
/**
 * Created by PhpStorm.
 * User: brian
 * Date: 3/25/17
 * Time: 2:06 PM
 */

function read_input($quantity) {
    for ($i = 1; $i <= $quantity; $i++) {
        $flag = ctype_digit($_POST["$i"]);
        if ($flag == TRUE) {
            $input[] = $_POST["$i"];
            settype($input[$i - 1], 'integer');
        } elseif ($flag == FALSE) {
            $input[] = NULL;
        }
    }
    return $input;
}


/*********************************************************************************************************************
 * Determines whether to display the form in the case of invalid input (float or numeric), or whether to display GCF,
 * LCM.
 ********************************************************************************************************************/

function is_valid_entry($numbers) {
    $flag = TRUE;
    foreach ($numbers as $number) {
        if ($number == NULL) {
            $flag = FALSE;
            break;
        }
    }
    return $flag;
}

function generate_factors($number) {
    for ($i = 1; $i <= $number; $i++) {
      $temp = $number / $i;
      if (gettype($temp) == 'integer') {
          $factors[] = $i;
       }
    }
    return $factors;
}

function create_multi_assoc_factors($numbers) {
    foreach ($numbers as $number) {
        $factors = generate_factors($number);
        $numbers_and_factors[$number] = $factors;
    }
    return $numbers_and_factors;
}

function determine_GCF($numbers) {
    $counter = 0;
    $factors = array();
    foreach ($numbers as $number) {
      $factors[$counter] = generate_factors($number);
      $counter++;
    }
    $cf = call_user_func_array('array_intersect',$factors);

    return end($cf); //first array value of common factors is GFC
}

/*
function determine_multiples($multiples) {
    $multiples =
}



function determine_LCM($numbers, $limit) {
    $counter = count($numbers);

    return $counter;
}
*/


function create_markup($numbers_factors, $gcf) {
    $html = '<div class="divider">';
    $html .= "<h2 class=\"border-bottom\">GCF: $gcf</h2>";
    $html .= '<span class="factor">Factors</span><ul>';
    foreach ($numbers_factors as $number => $factors) {
        $html .= "<span class=\"factor\"><li>$number</li></span>";
         $html.= '<ul><li>';
        foreach ($factors as $factor) {
            if ($factor !== $gcf) {
                $html .= $factor;
            }
            elseif ($factor == $gcf) {
                $html .= "<b>$factor</b>";
            }
            if ($factor < $number) {
                $html .= ', ';
            } else {
                $html .='.</li></ul>';
            }
        }
    } $html .= '</ul></div>';
    return $html;
}

function generate_form($input, $quantity) {
    $html = '<div class="divider-center">';
    $html .= '<h2>Invalid entry</h2>';
    $html .= '<h3>Please enter whole numbers only. Non-numeric characters, decimals... are not valid.</h3>';
    $html .= '<form name="theform" action="process.php" method="post" id="theform">';
    for ($i = 1; $i <= $quantity; $i++) {
        $array = $i - 1;
        $html .= "<input name=\"$i\" type=\"text\" size=\"3\" id=\"$i\" value=\"$input[$array]\">";
    }
    $html .= "<input type =\"hidden\" name=\"quantity\" value=\"$quantity\">";
    $html .= '<input type="submit" value="submit">';
    $html .= '</div>';
    return $html;
}

$quantity = $_POST['quantity'];
settype($quantity, 'integer');

$input = read_input($quantity);
$flag = is_valid_entry($input);
$numbers_and_factors = array();

if ($flag === TRUE) {
    $flag2 = FALSE;
   // $numbers_and_multiples = create_multi_assoc_multiples($input);
    $numbers_and_factors = create_multi_assoc_factors($input);
    $gcf = determine_GCF($input);
    $html = create_markup($numbers_and_factors, $gcf);
    $title = 'Success';
} elseif ($flag === FALSE) {
    $html = generate_form($input, $quantity);
    $title = 'Invalid submission';
}
?>


<!--end of php code-->
  <header>
    <h1>This website computes the Greatest Common Factor (GCF) and Least Common Multiple (LCM) for a group of numbers.</h1>
  </header>
  <section>
    <?php echo $html;?>
  </section>
  <footer>
    <p>
        Thank you for viewing my submission. I will complete <cite>PHP Patterns, Objects and Practice</cite>. I will
        submit a C++ program that will find the Greatest Common Factor/Least Common Multiple for 3 numbers. After
        that I will see if what I have done is acceptable for an override, if there are other requirements, or if
        I didn't make the cut (which if I didn't I don't care - I gave it a shot).<br><br>Thank you for taking time
        out of your busy schedule.
        <br>Sincerely,<br><br>Brian Abbott
     </p>
  </footer>
</body>
</html>

Open in new window

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial