Style css de news

Résolu
cabon.contact -  
dwade74 Messages postés 132 Statut Membre -
Bonjour,

Premièrement désolé pour le titre hasardeux,
Secondement j'ai un problème..
J'ai réaliser un système de news en PHP, le problème est que les news sont situé dans une div id, qui contient un backgroud.
Quand je met une deuxième news, les deux news s'affiches mais viennent ce superposer.
Je voudrais avoir un espace visible entre les news, je ne sais pas comment faire.

Avez vous une solution ?

Merci

12 réponses

  1.
    dwade74 Messages postés 132 Statut Membre 32
     
    Bonsoir
    Peut etre que tu as mis une hauteur fixe pour ton background.
    Sinon poste ton code ici
    0
  2. cabon.contact
     
    Voilà le code et au passage merci pour ta réponse ;) 

    html{
	background-color:#404040;
}

#centre{
	position: absolute;
	top:0; left:25%;
	background-color:#101010;
	width:50%; height:100%;
	overflow:hidden;
}

#message{
	position: absolute;
	top:5%; left:5%%;
	margin-bottom:5%;
	background-color:#7D7D7D;
	border: 2px solid white;
	border-radius:15px;
	width:40%; height:15%;
	color:White;
	padding:5%;
	font-family:Helvetica;
	font-size:14px;
}

#message a{
	color:#C0C0C0;
	text-decoration: none;
}

#message a:hover{
	color:#FFF;
}

#b_menu{
	position: fixed;
	bottom:0%; left:0%;
	background-color:#404040;
	border-top: 2px solid #7D7D7D;
	border-radius:15px 15px 0 0;
	width:100%; height:5%;
	color:White;
	font-family:Helvetica;
	font-size:14px;	
}


    <?php
require 'data/connect.php'
?>
<!DOCTYPE html>
<html>
<head>
	<title>Message</title>
	<meta charset="UTF-8">
	<link rel="stylesheet" type="text/css" href="templates/template.css">
</head>
<body>
<div id="centre">

<?php
        $req = $bdd->prepare('SELECT * FROM articles ORDER BY id DESC');
        $req->execute();
        while($data = $req->fetch(PDO::FETCH_OBJ)):?>
        
          
          <div id="message">
          <h2><?php echo $data->titre;?></h2>
          
            <p id="<?php echo $data->id;?>"><?php echo nl2br($data->contenu);?>
          </br>
          </br>
      <a href="#+1"> +</a> | <a href="#-1"> -</a> | 133 points
      </p>
        </div>
        <?php endwhile;
        ?>


</div>
</div>
<div id="b_menu"></div>
</body>
</html>
    0
  3. dwade74 Messages postés 132 Statut Membre 32
     
    je crois que c'est a cause de la div id message parce que tu mets une hauteur de 15%. essaye avec un height:auto;
    0
  4. cabon.contact
     
    Merci mais ça fonctionne toujours pas, j'ai fait un screen de ce que cela fait.

    http://img11.hostingpics.net/pics/363992Sanstitre.png
    0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. dwade74 Messages postés 132 Statut Membre 32
     
    essaye d'enlever la position absolute et top:5%; left:5%; pour la div message
    0
  8. dwade74 Messages postés 132 Statut Membre 32
     
    essaye de rajouter "margin-bottom:20%; pour essayer deux séparer les deux bloc si ca marche toujours pas demain j'essaierai sur mon ordi.
    0
  9. cabon.contact
     
    ça ne fonctionne toujours pas. En tout cas merci pour ton aide !
    0
  10. cabon.contact
     
    Si quelqu'un à une solution je suis preneur ! :)
    0
  11. dwade74 Messages postés 132 Statut Membre 32
     
    bonsoir
    désolé pour le retard
    je sais pas si ton problème est résolu.
    voila je viens d'essayer ça fonctionne plus tôt bien chez moi
    http://imageshack.us/a/img831/1534/sanstitre1ola.png

    j'ai tout simplement enlever la position: absolute dans message

    index.php

    <?php
    require ('config.php');
    ?>

    <?php
    $donnees = $bdd->query('SELECT * FROM news ORDER BY id DESC');
    while ($news = $donnees->fetch())
    {
    ?>
    <div id="message">

    <center><h3><?php echo $news['titre'];?></h3></center>
    <center><p><?php echo $news['contenu'];?></p></center>
    </div>
    <?php
    }
    $donnees->closeCursor();
    ?>

    css

    html{
    background-color:#404040;
    }

    #centre{
    top:0; left:25%;
    background-color:#101010;
    width:50%; height:100%;
    overflow:hidden;
    }

    #message{
    top:5%; left:5%;
    margin-bottom:5%;
    margin: 0 auto 5px auto;
    background-color:#7D7D7D;
    border: 2px solid white;
    border-radius:15px;
    width:40%; height:15%;
    color:White;
    padding:5%;
    font-family:Helvetica;
    font-size:14px;
    }

    #message a{
    color:#C0C0C0;
    text-decoration: none;
    }

    #message a:hover{
    color:#FFF;
    }

    #b_menu{
    position: fixed;
    bottom:0%; left:0%;
    background-color:#404040;
    border-top: 2px solid #7D7D7D;
    border-radius:15px 15px 0 0;
    width:100%; height:5%;
    color:White;
    font-family:Helvetica;
    font-size:14px;
    }
    0
  12. cabon.contact
     
    Désolé du retard aussi ^^ Il n'avait pas totalement était résolu mais maintenant oui, merci beaucoup !
    0
  13. dwade74 Messages postés 132 Statut Membre 32
     
    Bonsoir
    Cool alors, c'etait quoi le probleme ?
    Peut etre que ca pourrait aider quelqu'un.
    0

Discussions similaires

indice et exposant en css ?
yiv -
Kitkatryne -

19 réponses