Titre: affichage titre
Posté par: Elfy75 le le 04-04-2012 a 19:45:47
Bonjour à tous,
Je rencontre de nouveau un problème d'affichage (pour ceux qui m'ont aidé il y a quelques jours ;) )
Lorsque je réduis ou augmente la fenêre de mon navigateur, mon contenu (photos) bouge comme je le souhaitais, par contre mon titre qui se trouve à droite de mes photos ne suit pas le mouvement. et par conséquent passe au dessus de mes photos quand j'augmente ma fenêtre
:-\
Je voudrais tout simplement que tout bouge de la même façon je j'augmente ou réduise cette fenêtre.
Voici tout mon code.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Jules Egger</title>
</head>
<link rel="stylesheet" media="screen" type="text/css" title="style css" href="style.css" />
<body>
<div id="site">
<div id="vignettes">
<a href="series/jules_egger_1.html"><img src="vignettes/fede_0375.jpg" width="160" height="103" style="padding-right:15px;"/></a>
<img src="vignettes/2949-45.jpg" width="160" height="103" style="padding-right:15px;"/>
<img src="vignettes/WITCH2app.jpg" width="160" height="103" style="padding-right:15px;"/>
<img src="vignettes/photo_Jules_Egger_220.jpg" width="160" height="103" style="padding-right:15px;"/>
<br />
<a href="series/jules_egger_2.html"><img src="vignettes/07egtirag.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/fourcade01.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/1390-54BG.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/0442-45DP.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<br />
<a href="series/jules_egger_3.html"><img src="vignettes/faretra0__0789.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/icd __0127-4.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/PLS380.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/bacon.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<br />
<a href="series/jules_egger_4.html"><img src="vignettes/2997-54.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/0486-42.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/04R2.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/fourcade01.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<br />
<a href="series/jules_egger_5.html"><img src="vignettes/0402-44.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/386-54.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/0954.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
<img src="vignettes/2184-52.jpg" width="160" height="103" style="padding-right:15px; padding-top:15px" />
</div><!--fin div vignettes -->
<h1> J***** V****r</h1>
<h2> <a href="personnalites.html">Personnalités</a> - <a href="studio.html">Studio</a> - <a href="infos.html">Infos</a> - <a href="contact.html">Contact</a></h2>
</div><!--fin div titre -->
</div><!--fin div site -->
</body>
</html>
|
|
Code:
#site {
width:1200px;
height:800px;
margin-left:auto;
margin-right:auto;
overflow:auto;
}
body {
width:100%;
background-color:#FFF;
background-repeat:repeat;
margin:auto;
}
#vignettes {
width:800px;
margin-left:90px;
margin-top:90px;
margin-bottom:90px;
}
h1 {
width:1200px;
color:#000;
font-size:30px;
font-family:Arial, Helvetica, sans-serif;
letter-spacing:4px;
position:absolute;
left:900px;
top:475px;
}
h2 {
width:1200px;
color:#000;
font-size:20px;
font-family:Arial, Helvetica, sans-serif;
position:absolute;
left:900px;
top:525px;
}
a {
color:#000000;
text-decoration:none;
}
a:hover {
text-decoration:underline;
}
|
|
Voilà, j'ai pourtant essayé plusieurs choses mais rien n'y fais
Si quelqu'un peut m'éclairer se serait gentil.
Bonne soirée à tous,
Charlotte |
Titre: Re:affichage titre
Posté par: dandreaweb le le 05-04-2012 a 10:00:14
Bonjour Charlotte,
Je vous ai donné la solution pour votre problème précédent, mais il y a une chose que je ne comprends pas. Dans un autre poste vous dites :
"Personnellement j'ai suivi une formation à distance via l'université de Strasbourg, cette formation est vraiment complète avec de très bon enseignement.
Voici le lien de leur site: http://www.eformation-webmaster.net/".
Cette formation ne doit pas être si complète si vous n'arrivez pas à régler les problèmes que vous avez actuellement pour votre site. Je me trompe ?
Cordialement |
Titre: Re:affichage titre
Posté par: Elfy75 le le 05-04-2012 a 10:42:58
Bonjour Charlotte,
Je vous ai donné la solution pour votre problème précédent, mais il y a une chose que je ne comprends pas. Dans un autre poste vous dites :
"Personnellement j'ai suivi une formation à distance via l'université de Strasbourg, cette formation est vraiment complète avec de très bon enseignement.
Voici le lien de leur site: http://www.eformation-webmaster.net/".
Cette formation ne doit pas être si complète si vous n'arrivez pas à régler les problèmes que vous avez actuellement pour votre site. Je me trompe ?
Cordialement
|
|
Bonjour,
La formation que j'ai suivi via l'université de Strasbourg était comme je l'ai dit vraiment complète avec de très bon enseignants, un très bon suivi. Cette formation à duré un an, avec de nombreux séminaires, c'était assez rythmé, donc beaucoup de théorie mais très peu de pratique pour ma part travaillant à côté. D'autres on très bien pu allier les deux, et on aujourd'hui un excellent niveau. La qualité de la formation de l'université de Strasbourg n'est donc pas à remettre en cause :).
La solution que vous m'aviez donné à très bien fonctionné et vous en remercie, cependant après plusieurs manipulations sur mon titre, je ne parviens pas à obtenir le résultat souhaité.
Charlotte
|
Titre: Re:affichage titre
Posté par: KB le le 05-04-2012 a 11:36:13
1°. ton appel a ta feuille de style dois etre dans le <head>
2° pouquoi donner des largeurs aussi grande à tes h1 et h2?
|
Titre: Re:affichage titre
Posté par: Elfy75 le le 05-04-2012 a 11:46:02
1°. ton appel a ta feuille de style dois etre dans le <head>
2° pouquoi donner des largeurs aussi grande à tes h1 et h2?
|
|
Bonjour,
Erreur de débutante pour le placement de la feuille de style, merci
Mes largeurs sont aussi grandes car mon titre est positionné à droite de mes vignettes ( choix de mon ami), il est bien positionné là ou je le voulais mais ne suis pas mon contenu lorsque je réduis ou augmente la taille de ma fenêtre. Je ne trouve pas mon erreur. |
Titre: Re:affichage titre
Posté par: KB le le 05-04-2012 a 11:53:51
La largeur na rien a voir avoir le positionnement....
et chez moi, sur IE et FF, ton texte est toujours a droite des photos.
Si tu avais fait plus simple en créant 2 div l'une à coté de l'autre, le tout dans une div container, tu aurais évité bien des soucis
|
Titre: Re:affichage titre
Posté par: Elfy75 le le 05-04-2012 a 12:01:41
La largeur na rien a voir avoir le positionnement....
et chez moi, sur IE et FF, ton texte est toujours a droite des photos.
Si tu avais fait plus simple en créant 2 div l'une à coté de l'autre, le tout dans une div container, tu aurais évité bien des soucis
|
|
Autant pour moi, je mélange tout, je croyais que tu me parlais de la largeur de ma position absolute, je suis tellement préoccupée par ce truc là. :-\
une largeur de 800 px suffit?
Merci pour ton aide |
Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.
|