How can I use PHP code in a CSS file


Tags: php,css,sql,image,src

Problem :

I want to find an image source from a MySQL database and assign it to a css style. I just changed the .css extension to .php.

It does work with XAMPP and runs everything I want, but when I uploaded my code in cpanel it didn't work correctly.

I used this code in the css file:

Top of page:

<?php include '../Connections/Base.php'; ?>
 <?php header("Content-type: text/css; charset: UTF-8"); ?>

Some styles:

.box {
    overflow: hidden;
    display:block;
    border:4px solid #171717;
    position:absolute;
    cursor: pointer;
    float:left;
    display: inline-block;
    zoom: 1;
    background:url(<?php 
        $query = "SELECT imape_path FROM MyTable WHERE number='5' LIMIT 1";
        //echo $query;
        if ($result = $mysqli->query($query)) {
            while ($row = $result->fetch_assoc()) {
                echo $row['imape_path'];
            }
        }
 ?>) no-repeat;
}

How can I fix this problem?



Solution :

Personally, I do not think this is the right problem to address.

The whole point in separating markup and styles is to simplify things. I see very little value in separating it so rigidly you have to mix css, php and sql instead (you just moved the same problem elsewhere).

My suggestion is to configure .box's background using inline css in the html page itself and inject the url as any other value:

<div class="box" style="background: url('<?php ... ?>')">...</div>

    CSS Howto..

    What is the best tutorial or tutorials on how to make a tooltip using CSS or JQuery or Both? [closed]

    How to edit css for jquery datepicker prev/next buttons?

    how to make a div to wrap two float divs inside?

    How do I apply a max-width to an input field form-control with a trailing secondary button in Bootstrap 3?

    How to change size of SVG circle

    How can I add another level to this responsive horizontal nav?

    How to apply background color to buttons using css in asp.net?

    Ruby on Rails: (Beginner) How can I make my style sheet (in public/stylesheet folder) be used by my layouts?

    How to make tabs on the web page?

    How to add hover text on D3 disign?

    WebGL: How to make an interactive div (like text input) be drawn on some web gl 3d object and still be interactive?

    How div automatically adjust their size and positions the element inside it

    How to handle javascript & css files across a site?

    How to remove this extra part at the right?

    Show/Hide Markers that are pulled from function

    Html and css. Social buttons how to move them?

    Why does my progress bar shows full progress value before it start loading

    CSS position: absolute - understanding how to center text inside a div box

    How to create flexible div items that break after the line?

    How to center text in lists?

    HTML and CSS: How to play video on website [closed]

    how to clip text in css like gmail does to emails subject listings

    How to make the page load scrolled down to
    when loaded?

    How can I use .htaccess to send distant expiry headers on CSS and JS files?

    How to place Facebook send dialog box above other content?

    How to Fix Collapsing Top and Bottom Margins?

    How do I change ASP.NET App_Themes based on what Skin is selected in RadSkinManager?

    How to add a mailto to a sentence without extra spacing?

    How to vertical-align text on this input box for IE

    How do I assign styling to a Javascript variable?