Creating "CSS" with "PHP"

PHP
1

I am trying to create inline CSS using PHP Not working

<!DOCTYPE html>
<html>
<head>
<style>
*{padding-right: 0px; PADDING-left: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px;';

<?php
echo "<br/>";
echo '.button { ';
echo "<br/>";
echo 'background-color: green;';
echo "<br/>";
echo 'border: none;';
echo "<br/>";
echo 'color: white;';
echo "<br/>";
echo 'padding: 15px 32px;';
echo "<br/>";
echo 'text-align: center;';
echo "<br/>";
echo 'text-decoration: none;';
echo "<br/>";
echo 'display: inline-block;';
echo "<br/>";
echo 'font-size: 16px;';
echo "<br/>";
echo 'margin: 4px 2px;';
echo "<br/>";
echo 'cursor: pointer;';
echo "<br/>";
echo '} ';
echo "<br/>";
?>

</style>
</head>
<body>

<h2>CSS Buttons</h2>

<button>Default Button</button>
<a href="#" class="button">Link Button</a>
<button class="button">Button</button>
<input type="button" class="button" value="Input Button">

</body>
</html>

Thank You

2

It looks as though there is a missing closing curly bracket on line 5.

Try viewing source.

3

My code looks like this now with the closing curly bracket on line 5. Still not working

<!DOCTYPE html>
<html>
<head>
<style>
*{padding-right: 0px; PADDING-left: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px;}

<?php
echo "<br/>";
echo '.button { ';
echo "<br/>";
echo 'background-color: green;';
echo "<br/>";
echo 'border: none;';
echo "<br/>";
echo 'color: white;';
echo "<br/>";
echo 'padding: 15px 32px;';
echo "<br/>";
echo 'text-align: center;';
echo "<br/>";
echo 'text-decoration: none;';
echo "<br/>";
echo 'display: inline-block;';
echo "<br/>";
echo 'font-size: 16px;';
echo "<br/>";
echo 'margin: 4px 2px;';
echo "<br/>";
echo 'cursor: pointer;';
echo "<br/>";
echo '} ';
echo "<br/>";
?>

</style>
</head>
<body>

<h2>CSS Buttons</h2>

<button>Default Button</button>
<a href="#" class="button">Link Button</a>
<button class="button">Button</button>
<input type="button" class="button" value="Input Button">

</body>
</html>
4

I personally don’t see the point of doing this. To me it’s making it harder than just using plain old CSS. If you want to make style changes on the fly then good old javascript would do just find in my opinion.

5

What do you mean by not working.

Try:

  1. remming out all the Php script, run, validate web page. Correct any html or CSS errors and warnings.
  2. Add single php CSS script and repeat step 1
  3. Gradually increase php script and repeat step 1
6

We should see something like this:
Css is the same css as used in the example
The only difference is I am creating the css with php
css_buttons.html (48.0 KB)

7

Did you try step 1 in my previous post and use the following validation tests?

https://jigsaw.w3.org/css-validator/

Both validation pages allow copying and pasting your view source scripts,

8

When you mean remming do you commenting php out?

9

This is a php file not a html file. I think the validators are for html files

10

Yes.

<php 
 /* // Start of a block rem
...
// single line remove
# another single line rem
...

*/ 
// closed block rem in above line
?>
11

I just found the problem / answer

I’m creating invalid CSS by putting all those <br/> tags in the CSS. I should use echo “\n”; instead, to put actual newlines. Or just leave them out – CSS doesn’t care if the styles are on the same line or not.

John Thanks for your help

3 Likes
12

The browser requests the php file from the server.

The server receives the php request and generates a single html source script which is returned to the browser.

Browser receives and renders the html script.

The rendered html web page source can be viewed by right clicking and view source.

Edit:
Copying and pasting the source into the W3.org validation tests saves a lot of time, effort and frustration :slight_smile:

13

Yes, that’s exactly the problem, it makes no sense putting html into your css.

You can use \n to have new lines in double quotes:-

echo "background-color: green;\n" ;

That is your choice. If you want it “minified” leave the new lines out. If you want it readable, have new lines and indents.

Still, like @Pepster64 I don’t see the point of this, since the css is all static there is no need to use php.
I only use php to write css with dynamic styling that is dependant on variables.

14

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.