Style css de news

Résolu

Utilisateur anonyme -
dwade74 Messages postés 120 Date d'inscription Statut Membre Dernière intervention - 7 oct. 2012 à 02:14

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

Afficher la suite

A voir également:

Style css de news
Style word - Guide
Nom pour facebook stylé - Guide
Style d'écriture a copier coller - Guide
Chat style coco - Accueil - Réseaux sociaux
Nom de groupe whatsapp style - Guide

12 réponses

Réponse 1 / 12

dwade74 Messages postés 120 Date d'inscription Statut Membre Dernière intervention 32

Bonsoir
Peut etre que tu as mis une hauteur fixe pour ton background.
Sinon poste ton code ici

Réponse 2 / 12

Utilisateur anonyme

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>

Réponse 3 / 12

dwade74 Messages postés 120 Date d'inscription Statut Membre Dernière intervention 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;

Réponse 4 / 12

Utilisateur anonyme

Merci mais ça fonctionne toujours pas, j'ai fait un screen de ce que cela fait.

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

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

Posez votre question

Réponse 5 / 12

dwade74 Messages postés 120 Date d'inscription Statut Membre Dernière intervention 32

essaye d'enlever la position absolute et top:5%; left:5%; pour la div message

Réponse 6 / 12

Utilisateur anonyme

Cela ne fait toujours rien

Réponse 7 / 12

dwade74 Messages postés 120 Date d'inscription Statut Membre Dernière intervention 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.

Réponse 8 / 12

Utilisateur anonyme

ça ne fonctionne toujours pas. En tout cas merci pour ton aide !

Réponse 9 / 12

Utilisateur anonyme

Si quelqu'un à une solution je suis preneur ! :)

Réponse 10 / 12

dwade74 Messages postés 120 Date d'inscription Statut Membre Dernière intervention 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;
}

Réponse 11 / 12

Utilisateur anonyme

Désolé du retard aussi ^^ Il n'avait pas totalement était résolu mais maintenant oui, merci beaucoup !

Réponse 12 / 12

dwade74 Messages postés 120 Date d'inscription Statut Membre Dernière intervention 32

Bonsoir
Cool alors, c'etait quoi le probleme ?
Peut etre que ca pourrait aider quelqu'un.

Discussions similaires

Problème de table des matières

Votre réponse

Discussions similaires