Home > Software design >  Why my html is displaying but without css?
Why my html is displaying but without css?

Time:10-07

I'm working with php on web app that display a list of data from mysql's table. I also want the user to have the posibility of adding row of this table trought the web app. My problem is that I created a form to add data that I whant to stylize. This form is fonctional but my code in admin.css doesn't apply at all.

I have a php file where I call (or should I say inject?) html from another file. My css is also in another file but called in the head balise of formAdd.html

Somewhere in my admin.php I call (or inject ?) my formAdd.html

<?php
        require('html/formAdd.html');
?>

formAdd.html:

<html>
    <head>
        <link rel="stylesheet" href="/css/formAdd.css" type="text/css">
    </head>

    <body>  
        <form action="" method="POST">
            <h1>Test formulaire</h1>
            <div >
                nom<input type="text" name="nom"><br>
                <select name="categorie" id="cat-select">
                    <option value="1">Fiscalité IS</option>
                    <option value="2">Réorganisations, acquisitions et méthodologie</option>
                    <option value="3">Contrôle et contentieux fiscal</option>
                    <option value="4">Fiscalité patrimoniale</option>
                    <option value="5">Fiscalité Immobilière</option>
                    <option value="6">Introduction à la TVA et droits de douanes</option>
                    <option value="7">Excel</option>
                url<input type="text" name="url">
                direct_redirect<input type="text" name="direct_redirect">
                img<input type="text" name="img">
                <input type="submit" name="submit">
            </div>
        </form>
    </body>
</html>

formAdd.css:

   h1 {
        background-color: blueviolet;
        color: brown;
    }
    .addForm {
        background-color: black;
    
    }
    .submit {
        background-color: lightblue;
        border-radius: 10px;
    }

Here is a tree form the folder where my admin.php is:

.
├── Index.php
├── admin.php
├── css
│   └── formAdd.css
├── delete.php
├── formModif.php
├── formModifStyle.css
└── html
    ├── formAdd.php
    └── formUpdate.html

EDIT: It is true that it may not have been a good idea to inject a full ... ... So I changed my formAdd.html to the following:

<form action="" method="POST">
    
    <h1>Test formulaire</h1>
    <div >
        nom<input type="text" name="nom"><br>
        <select name="categorie" id="cat-select">
            <option value="1">Fiscalité IS</option>
            <option value="2">Réorganisations, acquisitions et méthodologie</option>
            <option value="3">Contrôle et contentieux fiscal</option>
            <option value="4">Fiscalité patrimoniale</option>
            <option value="5">Fiscalité Immobilière</option>
            <option value="6">Introduction à la TVA et droits de douanes</option>
            <option value="7">Excel</option>
        url<input type="text" name="url">
        direct_redirect<input type="text" name="direct_redirect">
        img<input type="text" name="img">
        <input type="submit" name="submit">
    </div>
</form>

I also delete the call to my css in formAdd.html beacuse I have already a call to css in my admin.php:

<link rel="stylesheet" type="text/css" href="../../assets/css/admin.css">

I deplace the code in my formAdd.css in admin.css, but still I don't have any style applying. I don't know if a shoul display my admin.php file ? Be cause it's got a lot of code note related to the problem... In my console I have the error: Failed to load resource: the server responded with a status of 404 (Not Found)

CodePudding user response:

Try this:

<link rel="stylesheet" href="../css/formAdd.css" type="text/css">

CodePudding user response:

I think the solution was the changed in made in formAdd.html (deleting everything out of form balise) and only using css from assets/css/admin.css Despite my first modifications I had not seen any change, the action I needed to see my css was clearing my Browser's data.

I don't know if this is common knowledge or not but I'm really surprised this is the answer

  •  Tags:  
  • css
  • Related