CODEWITHSUNDEEP
phphtmlcss
El Coo Cooi
El Coo Cooi

Reputation: 13

PHP and includes

I am creating my first website from scratch and had seen something where you can reduce code by using PHP includes for sections of the site that are to be repeated. So far, I have a head.php (which I added due to my stylesheet.css being linked there and needing access to it on every page), header.php, footer.php, index.php, and other pages with the php extension (about, contact, that bunch).

Everything is appearing where I'd like it to except for one issue: when setting the body background color, everything (all includes: header.php, footer.php) seems to be in the body. I tested this by setting a border around the body, and it confirmed what I thought.

Does anyone have an idea what is going wrong? I am using flexbox in my header, footer, and other bits within the index file, but I don't think that should be affecting anything.

<!DOCTYPE html>


<?php include 'head.php'; ?>
  <?php include 'header.php'; ?>


  <body id="main-block">
    <!-- Button links to Portfolio and Other stuff -->
    <div class="flex-container">
      <a class="main-button" href="#">Web Work</a>
      <a class="main-button" href="#">Other Work</a>
    </div>

  </body>

<?php include 'footer.php'; ?>
</html>

Upvotes: 0

Views: 75

Answers (2)

sensorario
sensorario

Reputation: 21698

I admit that I do not really understand your issue. But I'll give you a little snippet to start coding php:

<html>
    <head>
        <title>Welcome</title>
        <style>
            <?php include 'stile.php'; ?>
        </style>
    </head>
    <body>
        <?php include 'header.php'; ?>
        <?php include 'footer.php'; ?>
    </body>
</html>

Upvotes: 0

hello world
hello world

Reputation: 1765

your body tag is suppose to wrap around your header and footer elements. see below markup

<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>
  <?php include (header);?>
  <?php include (footer);?>
  </body>
</html>

if u wanna change the background color of your elements just add css

element { background-color:pink }

Upvotes: 2

Related Questions