CODEWITHSUNDEEP
phphtmlcss
user3613603
user3613603

Reputation: 23

Adding CSS code (not file) within a PHP page

I can't seem to find the right answer for this. I was wondering how to include a CSS code inside my PHP page.

My PHP page has scripts in it then I use echo to display HTML elements when the page is loaded. 3 of those elements are forms with submit buttons. I was trying to get those submit buttons have the same width and height. I researched and it seems the only solution is adding CSS which is usually inserted inside the tag but I have a PHP page, not HTML. If I try to add and tags the PHP file in file manager view changes into HTML file meaning if I add the tag the server identifies my PHP file as HTML instead so I don't want that additional problem.

I just wanted to have the form buttons have the same width. below is currently what I have, I added some spaces on the value of each submit button to try and extend their width but it's still noticeably not matching.

http://s12.postimg.org/iqp7okq55/Capture2.png

EDIT:

Thanks guys, you helped me greatly. I added this code before any other echo for HTML elements:

echo "<html><head><style>input.panelbutt {width:120px;}</style></head>";

Of course I added a closing HTML tag echo at the end and made sure the submit button has "Class='panelbutt'" attribute.

Upvotes: 0

Views: 90

Answers (2)

vogomatix
vogomatix

Reputation: 5093

There is no reason your PHP script cannot output CSS in the same way as it does HTML.

I personally like using HEREDOC syntax instead of multiple echo statements as I think it looks neater (with less \ characters) and it's easier to embed PHP variables into, but that's up to you...

echo <<<EOF
<style>
/* put your CSS here */
</style>
EOF;

or put it in inline by closing the PHP tags

<?php
// some php here...
?>
<html>
  <head>
     <title>PHP, CSS and HTML mix page</title>
     <!-- more head tags here.... -->
     <style> 
     /* css here */ 
     </style>
  </head>
  <body>
  <?php // more PHP
  ?>
  <!-- html here -->
  </body>
</html>

Upvotes: 2

Chris Pickford
Chris Pickford

Reputation: 9001

Create your CSS file as a static resource then when generating your HTML to return to the browser simply include the following line in the <HEAD> area:

echo "<link rel=\"stylesheet\" type=\"text/css\" href=\"pathtofile.css\">";

Example css:

button.classABC {
    width: 100px;
}

Upvotes: 0

Related Questions