Discussion :

[M.Mahum]

Bonjour,

je suis étudiant en BTS SIO, et je dois développer pour les cours un site internet mais j'ai rencontré le problème suivant.



Comme vous pouvez le voir, en fonction du zoom de l'écran sur ma page le contenu de ma div sort de cette dernière. Ci joint le code HTML et CSS de cette div.

HTML

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
 
<div id="bloc1">
            	<div id="zoneTexte_bloc1">
                	<h3> Bienvenue sur mon <br/>
                    PortFolio : </h3>
 
                    <p>
                    	Ce site à pour but de présenter mes compétence aux entreprises. A partir de certaine page tel que : <br/>
                   </p>
                        <ul>
                        	<li>
                            	<a href="">
                                	Curriculum Vitae (C.V).
                                </a>
                            </li>
                            <li>
                            	<a href="">
                                	Contactez-moi.
                                </a>
                            </li>
                            <li>
                            	<a href="">
                            		News.
                                </a>
                            </li>
                            <li>
                            	<a href="">
                                	Projets
                                </a>
                            </li>
                        </ul>
                        <p>
                    		Vous aurez ainsi accès à toutes les informations sur mes compétences et mes capacités dans le domaine de l'informatique<br/>
                            Ce site a été crée à partir de toutes mes connaissances, et donc permet de montrer se que je suis capable de faire et les options que je peux apporté à un site internet. <br/>
                            De plus, je travaille acutellement sur différents projets de développement d'applications ou de page internet. Depuis ce site vous pourrez consulter des news qui montrerons l'avancement de ces différents projets et vous pourrez même commenter afin de m'aider à les améliorer. <br/>
                            Je vous remercie de prendre du temps pour consulter mon porte-folio, et n'hésiter pas à me contacter <a href="" id="lienRapide">ici</a> si vous avez la moindre question.<br/>
                            <br/>
                            Je vous souhaites à tous une bonne visite !
                    </p>
                </div>
            </div>

CSS

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
 
#bloc1 {
	float: left;
	width: 500px;
	height: 610px;
	background-image: url(../images/fond_bloc1.png);
}
#zoneTexte_bloc1 {
	float: left;
	margin-left: 20px;
	margin-top: 20px;
	width: 460px;
	height: 565px;
	background-color: black;
}
#lienRapide {
	color: red;	
}

Est-ce que quelqu'un pourrait m'aider à trouver mon erreur, ou alors se que j'ai oublié de préciser. Merci d'avance.

Cordialement.

[Invité]

Peut être en enlevant la propriété height de ton bloc1

[M.Mahum]

Merci de ta réponse, mais le problème c'est que le bloc 1 dois avoir une taille définit étant donné qu'il a une image en fond. Lorsque j'enlève la propriété heigth de mon bloc1, l'image ne rentre pu dans la div et on ne voit pu le bas. J'ai pris un screen pour te le montrer.


De plus sa ne change rien . Mais encore une fois merci de m'aider .

[NoSmoking]

Bonsoir,
dans ce cas mets un min-height: 565px;

[M.Mahum]

Bonjour NoSmoking
Sa ne change rien au screen précédant. Merci quand même!

[Invité]

Bonsoir,
dans ce cas mets un min-height: 565px;

Pas plutôt un max?

[NoSmoking]

Pas plutôt un max?

ni l'un ni l'autre, il semblerait que le problème de M.Mahum est que l'image background ne suit pas le redimensionnement, car le cadre lui s'étend bien.

Pour résoudre ce problème(?) il faut voir du coté du CSS3 background-size