Discussion :

[ric009]

Bonjour,
je rencontre un problème avec une image qui ne rentre pas dans ma div content !

voici mon code :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<div id="photo_nom">
 
        <div id="photo">
        <img src="images/20140112.png" width="200" height="150" />
        </div>
 
 
        <div id="nom_prenom">
        <h1 id="titre_nom_prenom">xx xx</h1>
        </div>
 
<br /><br /><br />
</div>

je suis obligé de mettre des </br> pour que mon content couvre toute l'image

voici le css de mon content :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
 
#content{
margin-top:5%;
margin-bottom:5%;
margin-left:12%;
margin-right:10%;
height:100%;
min-width:1024px;
width:1000px;
background-color:#7c6b5e;
}

Cela peut venir d'une erreur dans mon content ?

Merci par avance

[Candygirl]

Bonjour,

Le code que tu donnes est insuffisant puisqu'il ne permet pas d'observer le problème.

L'hypothèse la plus probable est que tu aies fait flotter #photo, auquel cas tu devrais consulter cette partie de la faq.

[ric009]

Merci pour la réponse ! j'ai ajouter un overflow c'étais bien à cause d'un float de la photo mais j'ai le même problème pour mon menu qui s'affiche en bas du content alors que j'ai mis un overflow sur le content voici le code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
#content{
margin-top:5%;
margin-bottom:5%;
margin-left:12%;
margin-right:10%;
height:100%;
min-width:1024px;
width:1000px;
background-color:#7c6b5e;
}
 
#nom_prenom{
margin-left:30%;	
}
 
#photo{
float:left;
}
 
#photo_nom{
margin-left:5%;
overflow:hidden;
}
 
 
#titre_nom_prenom{	
font-family:Arial, Helvetica, sans-serif;
font-size:40px;
}
 
#presentation{
font-size:25px;
margin-left:34%;
margin-top:-10%;
}
 
 
ul{
	margin-left:12%;
    display: table;
    width: 1025px;
    margin-bottom:3%;
    padding: 0;
    background:#a2c8bf;
    background:#a2c8bf;
    background:#a2c8bf;
    background:#a2c8bf;
    background:#a2c8bf;
    background:#a2c8bf;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3),
                0 3px 5px rgba(0, 0, 0, .2),
                0 5px 10px rgba(0, 0, 0, .2),
                0 20px 20px rgba(0, 0, 0, .15);
overflow:hidden;	
}
 
 
ul li{
    display: table-cell;
}
 
ul li a{
    display: block;
    text-align: center;
    color:#000; 
    text-decoration: none;
    padding: 8px 40px 17px 40px;
	text-shadow: 0 1px 0 rgba(255, 255, 255, .4);
 
	box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset , 
                0 -1px 0 hsl(210, 100%, 32%) inset, 
                0 -2px 0 hsl(210, 100%, 38%) inset, 
                0 -3px 0 hsl(210, 100%, 44%) inset, 
                0 -4px 0 hsl(210, 100%, 50%) inset, 
 
	transition: padding .3s, background:#003535;
	position: relative;
 
 
}
 
ul li:first-child a{
    border-radius: 3px 0 0 3px;
}
ul li:last-child a{
    border-radius: 0 3px 3px 0;
}
 
ul li a:hover, 
ul li a:focus{
    background: rgba(255,255,255,.2);  
}
 
ul li a:active{
    background: linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.1)); 
    box-shadow: 0 0 2px rgba(0,0,0,.3) inset;
}
 
ul li a::before{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 9px;
    margin-left: -2px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background:#000; 
}
 
ul li a:hover::before,
ul li a:focus::before{
    background: white;
    box-shadow: 0 0 2px white, 
                0 -1px 0 rgba(0, 0, 0, .4);
}

voici mon html que j'ai include dans la div 'content'

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<ul>
  <li><a href="index.php?id=menu1" title="#">menu1</a></li>
  <li><a href="index.php?id=menu2" title="#">menu2</a></li>
  <li><a href="index.php?id=menu3" title="#">menu3</a></li>
</ul>

Merci par avance pour votre aide.

[Invité]

Bonjour,
on ne voit toujours pas dans le code html la div "content" !

Peux-tu mettre un code plus complet ??

[ric009]

voila mon content

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<body>
 
<div id="groupe">
<div id="content">
<?php 
include("hautpage.php"); 
echo '<br/>';		
include ("contenu.php"); 
echo '</div>';
include("menu.php");
echo '</div>';
echo '<div id="piedpage" align="center">';
include ("piedpage.php");
 
?>
</div>
</div>	
 
</body>

[Invité]

Comme tu es ici dans le forum CSS, le PHP n'a pas lieu d'être...

Affiche le code html généré : "Ctrl" + "U".
(sinon, on ne peut pas tester...)