Probleme de d'affichage div mal placés

CastorPC84 Messages postés 5 Date d'inscription Statut Membre Dernière intervention -
Mikey_UFC Messages postés 312 Date d'inscription Statut Membre Dernière intervention - 29 oct. 2008 à 14:32

Bonjour la communauté, je pense que mon problème n'est pas difficile à résoudre mais j'ai un niveau débutant.
Voila l'objet de mon message: je veux afficher une galerie en flash à base de simple viewer et un lecteur de MP3 avec playlist (Deezer pour ne pas le nommer).
La page doit se constituer comme ceci:

Un div header (navigation)
Un div flash_player_content (contenant la galerie Flash Simple Viewer et à coté le lecteur MP3 Deezer)
Un div flashcontent contenant la galerie Flash Simple Viewer
Un div playercontent contenant le lecteur de MP3 avec playlist Deezer
Un div footer contenant le bas de page

C'est relativement simple, en apparence, je n'y arrive pas.
En fait le lecteur MP3 s'affiche dans la zone du footer au lieu de s'afficher à coté de la zone flashcontent.
J'espère que je me suis bien fait comprendre, je veux la galerie et le lecteur dans le même div, comment faire ?

Voici le code de la page
<style type="text/css">
/* hide from ie on mac \*/
html {
height: 100%;
overflow: hidden;
}

#flash_player_content {
width: 100%;
height: 600px;
}

#flashcontent {
width: 85%;
height: 600px;
}

#playercontent {
width: 200pix;
height: 236px;
}

/* end hide */

body {
height: 100%;
margin: 0;
padding: 0;
background-color: #181818;
color:#ffffff;
font-family:sans-serif;
font-size:16;
}

a {
color:#cccccc;
}

#header {
text-align: center;
background-color: #222222;
width: 100%;
height: 20px;
padding: 10px 0 10px 0;

}

#footer {
text-align: center;
background-color: #222222;
color:#FFFFFF;
width: 100%;
height: 12px;
padding: 5px 0 10px 0;
}
</style>
</head>
<body>
<div id="header" >
<a href = "../gallery1/index.html">Gallery 1</a> | <a href = "../gallery2/index.html">Gallery 2</a>
</div>

<div id="flash_player_content" >

<div id="flashcontent">SimpleViewer requires JavaScript and the Flash Player. <a href="https://get.adobe.com/flashplayer/">Get Flash.</a>

<script type="text/javascript">

var fo = new SWFObject("viewer.swf", "viewer", "100%", "100%", "8", "#181818");

// SIMPLEVIEWER CONFIGURATION OPTIONS
// To use an option, uncomment it by removing the "//" at the start of the line
// For a description of config options, go to:
// https://www.simpleviewer.net/simpleviewer/support/v1_9/options.html

//fo.addVariable("xmlDataPath", "gallery.xml");
//fo.addVariable("firstImageIndex", "5");
//fo.addVariable("langOpenImage", "Open Image in New Window");
//fo.addVariable("langAbout", "About");
//fo.addVariable("preloaderColor", "0xFFFFFF");

fo.write("flashcontent");
</script>

<div id="playercontent" style="width:180px;height:236px;"><object width="180" height="236"><param name="movie" value="http://cdn-files.deezer.com/swf/kamino-v15.swf?sl=1&cs=0&path=12988760&lang=fr&colorBack=0x525252&colorVolume=0x00CCFF&colorScrollbar=0x666666&colorText=0xFFFFFF&autoplay=1&autoShuffle=0&id=3769241"></param><embed src="http://cdn-files.deezer.com/swf/kamino-v15.swf?sl=1&cs=0&path=12988760&lang=fr&colorBack=0x525252&colorVolume=0x00CCFF&colorScrollbar=0x666666&colorText=0xFFFFFF&autoplay=1&autoShuffle=0&id=3769241" type="application/x-shockwave-flash" width="180" height="236"></embed></object><br><font size='1' color ='#000000' face='Arial'>Découvrez <a href='http://www.deezer.com/fr/aaron.html'>AaRON</a>!</font>
</div>
</div>
<div id="footer">copyright 2008 Thierry HELLEU Photographe</a></div>
</body>
</html>

Merci pour votre aide, je suis dans la mouise ! ! ! ! ! ! ! ! ! ! !

A voir également:

Probleme de d'affichage div mal placés
Affichage double ecran - Guide
Problème affichage fenêtre windows 10 - Guide
Windows 11 affichage classique - Guide
J'ai perdu mes places de concert fnac - Forum Consommation & Internet
Problème affichage page internet google chrome - Forum Téléphones & tablettes Android

8 réponses

Réponse 1 / 8

castorPC84

Bonjour la communauté !

J'ai résolu la plupart des problèmes que j'ai rencontrés, il en reste quelques un de mineurs comme celui-ci;

la ligne blanche en haut du DIV #playercontent en contact avec le menu en haut à droite, je ne sais pas comment faire pour que cela ne se voit pas du tout.

voici le lien du site http://zartsico.redby.fr/matcherie/gallery1/index.html

Merci à tous pour votre aide.

Réponse 2 / 8

Mikey_UFC Messages postés 312 Date d'inscription Statut Membre Dernière intervention 1

Je viens de regarder, tout à l'air réglé ?

Réponse 3 / 8

CASTORPC84

Bonsoir,

En effet, tout est réglé sauf la ligne blanche qui apparait en haut du DIV #playercontent en contact avec le menu en haut à droite, je ne sais pas comment faire pour que cela ne se voit pas !

Merci encore à vous tous, si vous connaissez la solution pour cette ligne blanche, je suis preneur ! C'est pa bien grave, mais je suis pointilleux sur l'esthétisme.

Réponse 4 / 8

Mikey_UFC Messages postés 312 Date d'inscription Statut Membre Dernière intervention 1

Un :

border: solid #222222 0px;

Ca marche pas ?

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

Posez votre question

Réponse 5 / 8

CASTORPC84

je suis pas très calé, aussi je ne connais pas cette fonction ... peux-tu m'expliquer exactement ce que cette ligne de code implique et me dire où je suis censé la positionner, dans le DIV #playercontent ? Merci

Réponse 6 / 8

Mikey_UFC Messages postés 312 Date d'inscription Statut Membre Dernière intervention 1

Dans le CSS de playercontent tu rajoutes

border:0px;

( ça doit suffire)
Ca doit enlever la bordure de ton div.

Réponse 7 / 8

Mikey_UFC Messages postés 312 Date d'inscription Statut Membre Dernière intervention 1

#playercontent {
width: 200pix; => 200px :)
height: 236px;
}

Pourquoi tu remets : <div id="playercontent" style="width:180px;height:236px;">

Pourquoi si #flashcontent a width: 85%, playercontent n'a pas width:15%

Ensuite, je rajouterais peut-être un "float:left;" dans #flashcontent et "float:right;" dans #playercontent

Réponse 8 / 8

CastorPC84 Messages postés 5 Date d'inscription Statut Membre Dernière intervention

Merci Mikey_UFC, j'ai fait les modifs que tu m'as proposé et d'autres, ça va déjà beaucoup mieux.

Je vois mon lecteur, ai réussi à le placer plus ou moins correctement ... mais lorsque (dans Firefox) j'ouvre mon volet de marque-pages (c'est comme cela que je fais pour vérifier le comportement du Redimensionnement), la page se Redimensionne, là ça va, mais lorsque je le referme, le lecteur ne revient pas correctement à sa place, il est masqué en partie. Par contre, quand je passe la souris sur la partie masquée, le lecteur s'affiche en entier dans les parties balayées par le curseur, ça fait ça chez toi aussi ?

Il doit y avoir quelque chose qui coince encore !

Autre chose, mon DIV flashcontent déborde en bas sur le footer et le DIV playercontent déborde un peu par le haut sur le menu.

J'aimerai aussi savoir comment je peux faire pour avoir la même couleur de fond du footer que les autres DIV,

Je viens d'uploader à nouveau le fichier index.html modifié

Merci pour ton aide

Discussions similaires

Les images ne s'affichent plus

impossible de voir les photos et videos sur une conversation messenger

Probleme d'affichage google chrome

Les meilleurs places bercy / accor hotel arena

Problème d'affichage d'une page web.

Votre réponse

Discussions similaires