PB CSS avec html

Suivre ce topic
Ce topic est suivi par : Personne...
sargasses

sargasses Le 13 novembre 2017 à 18:27 (Édité le 25 janvier 2019 à 17:54)

Bonjour 

j'ai un problème de css avec du html & php
j'ai un menu (bandeau noir) qui ne vas pas jusqu'au bout de mon td

je débute dans le css et html

merci bien de m'aider

voici le code

<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="home.css"/>
    </head>
    <body>
        <nav>
            <ul>
                <li class="menu-retour"><a href="#">Retour Consultation</a></li>
                <li class="menu-home"><a href="#">Menu</a></li>
            </ul>
        </nav>
        <br />
        <br />
        <table>
            <tr>
                <th>nombres series</th>
                <th>nombres groupes</th>
                <th>nombres videos</th>
            </tr>
            <tr>
                <td align="center"><?php echo "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"; ?></td>
                <td align="center"><?php echo "bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb"; ?></td>
                <td align="center"><?php echo "ccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc"; ?></td>
            </tr>
        </table>
    </body>
</html>
html {
    color: #323232; /* pas complètement noir */
    background: #ddd; /* pas complètement blanc */
}
body {
    font-family: Verdana, Calibri, sans-serif;
    margin: 0px;
    padding: 0px;
}
nav > ul {
    margin:0px;
    padding:0px;
}
nav li {
    list-style-type: none;
}
nav > ul > li {
    float: left;
    position: relative;
}
nav {
    background-color: #424558;
}
nav > ul::after {
    content: "";
    display: table;
    clear: both;
}
nav a {
    display: inline-block;
    text-decoration: none;
}
nav > ul > li > a {
    padding: 20px 30px;
    color: #FFF;
}
.menu-home:hover {
    border-top: 5px solid #0ACD16;
    background-color: RGBa(50, 180, 50, 0.15);
}
.menu-retour:hover {
    border-top: 5px solid #9370D8;
    background-color: RGBa(147, 112, 216, 0.15);
}
nav > ul > li:hover a {
    padding: 15px 30px 20px 30px;
}
table {
    border-collapse: collapse;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
}
table, th, td {
    border: 1px solid black;
}
th {
    overflow: hidden;
    white-space: nowrap;
    padding-left: 10px;
    padding-right: 10px;
}
td {
    overflow: hidden;
    white-space: nowrap;
}

Cordialement
Rivens

Rivens Le 15 novembre 2017 à 16:26 (Édité le 15 novembre 2017 à 16:27)

Bonjour,
Je  n'ai pas la réponse a ton problème mais je te dis une astuce:
<?php echo "aaaa" ?>
/*est egal a */
<?= "aaaa ?>
blabla23272327

blabla23272327 Le 19 novembre 2017 à 12:48

dans le css tu ajoutes dans le nav -----> width: 100%;
ou tu rajoutes un header au début de ton body qui se termine à la fin de ton menu et tu attribut width:100%;
ellaparker

ellaparker Le 6 août 2019 à 11:19

Merci beaucoup c'est exactement ce qu'il me fallait 
run 3
Balatharas

Balatharas Le 8 août 2019 à 00:18

On peut pas savoir quelle est la taille de ton écran donc ici
nav {
    background-color: #424558;
}

Tu ajoutes une ligne width: 15em; et a la place de 15em tu tâtonnes en modifiant comme ça te convient.
Vous devez être connecté pour poster une réponse. Se connecter ou Créer un compte