Probleme de centrage video sur page HTML
cs_mel06
Messages postés
6
Date d'inscription
mardi 27 mai 2008
Statut
Membre
Dernière intervention
26 juin 2008
-
26 juin 2008 à 19:23
Bling 182 Messages postés 510 Date d'inscription lundi 27 novembre 2006 Statut Membre Dernière intervention 5 juillet 2009 - 27 juin 2008 à 00:14
Bling 182 Messages postés 510 Date d'inscription lundi 27 novembre 2006 Statut Membre Dernière intervention 5 juillet 2009 - 27 juin 2008 à 00:14
A voir également:
- Probleme de centrage video sur page HTML
- Html array - Conseils pratiques -PHP
- Exemple de page d'authentification - Conseils pratiques -PHP
- Span html - Forum PHP
- Exemple de page d'accueil html et css - Forum Javascript / DHTML
- Mettre une page comme page principale en html ✓ - Forum PHP
6 réponses
Bling 182
Messages postés
510
Date d'inscription
lundi 27 novembre 2006
Statut
Membre
Dernière intervention
5 juillet 2009
3
26 juin 2008 à 19:31
26 juin 2008 à 19:31
Oui colle le code ici.
SInon, vite fait (j'ai pas regardé ton code) pour le centrage :
une div englobante, de taille fixe. La dedans, une div qui contient ton element, avec dans la css, une taille fixe et 'margin : 0 auto 0 auto;'
Le centrage sera alors automatique par rapport à la div englobante.
SInon, vite fait (j'ai pas regardé ton code) pour le centrage :
une div englobante, de taille fixe. La dedans, une div qui contient ton element, avec dans la css, une taille fixe et 'margin : 0 auto 0 auto;'
Le centrage sera alors automatique par rapport à la div englobante.
cs_mel06
Messages postés
6
Date d'inscription
mardi 27 mai 2008
Statut
Membre
Dernière intervention
26 juin 2008
26 juin 2008 à 19:35
26 juin 2008 à 19:35
Voici le code mon medias.php :
<!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=iso-8859-1" />
<title>Tristane dans les médias</title>
</head>
----
VIDEOS,
----
Présentation de Tristane
<object width="320" height="336" class="couv">
http://www.dailymotion.com/swf/x3gkgu&related=0">
name="allowFullScreen" value="true">
http://www.dailymotion.com/swf/x3gkgu&related=0" type="application/x-shockwave-flash" width="420" height="336" allowFullScreen="true" allowScriptAccess="always"></object>
<!---->
Interview réalisée par AUTEURS TV - Novembre 2007
<!--PRIX DU PREMIER ROMAN DE CHAMBERRY
-->
,
</html>
Et le CSS est un peu enorme en fait....mais les classes utilisees sont les suivantes :
.tit_media
{
color: #2B77B1;
font-size: 14px;
letter-spacing: 2px;
}
.tit_vid
{
color: #2B77B1;
font-size: 13px;
font-weight: bold;
}
.couv
{
float: none;
margin-top: 15px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 5px;
border: 3px ridge #3D83B7;
}
.edition
{
font-style: italic;
font-size: 10px;
font-weight: bold;
}
<!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=iso-8859-1" />
<title>Tristane dans les médias</title>
</head>
----
VIDEOS,
----
Présentation de Tristane
<object width="320" height="336" class="couv">
http://www.dailymotion.com/swf/x3gkgu&related=0">
name="allowFullScreen" value="true">
http://www.dailymotion.com/swf/x3gkgu&related=0" type="application/x-shockwave-flash" width="420" height="336" allowFullScreen="true" allowScriptAccess="always"></object>
<!---->
Interview réalisée par AUTEURS TV - Novembre 2007
<!--PRIX DU PREMIER ROMAN DE CHAMBERRY
-->
,
</html>
Et le CSS est un peu enorme en fait....mais les classes utilisees sont les suivantes :
.tit_media
{
color: #2B77B1;
font-size: 14px;
letter-spacing: 2px;
}
.tit_vid
{
color: #2B77B1;
font-size: 13px;
font-weight: bold;
}
.couv
{
float: none;
margin-top: 15px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 5px;
border: 3px ridge #3D83B7;
}
.edition
{
font-style: italic;
font-size: 10px;
font-weight: bold;
}
Evangun
Messages postés
1980
Date d'inscription
dimanche 20 février 2005
Statut
Membre
Dernière intervention
24 septembre 2012
4
26 juin 2008 à 19:56
26 juin 2008 à 19:56
Salut,
à première vue comme ça je dirais que c'est un problème de div pas fermée, ce genre de chose...
plutôt que de mettre d'autres div ou du css pour régler artificiellement le problème, tu devrais remettre ton code à plat, proprement, bien indenté et tout. Parce que quand on ouvre les balises <html> et <head>, puis qu'on met du code html et js, puis qu'on redéclare de nouveau le doctype et les headers, ça commence déjà très mal ^^
à+
à première vue comme ça je dirais que c'est un problème de div pas fermée, ce genre de chose...
plutôt que de mettre d'autres div ou du css pour régler artificiellement le problème, tu devrais remettre ton code à plat, proprement, bien indenté et tout. Parce que quand on ouvre les balises <html> et <head>, puis qu'on met du code html et js, puis qu'on redéclare de nouveau le doctype et les headers, ça commence déjà très mal ^^
à+
Bling 182
Messages postés
510
Date d'inscription
lundi 27 novembre 2006
Statut
Membre
Dernière intervention
5 juillet 2009
3
26 juin 2008 à 19:57
26 juin 2008 à 19:57
Je te mets un code "corrigé", qui devrait fonctionner :
id="video_wrapper"> Présentation de Tristane
id="video"> <object width="320" height="336" class="couv">http://www.dailymotion.com/swf/x3gkgu&related=0">
"
type="application/x-shockwave-flash" width="420" height="336"
allowFullScreen="true"
allowScriptAccess="always"></object>
<!---->
Interview réalisée par AUTEURS TV - Novembre 2007
et to css, modifié :
#video_wrapper {
width : 100%;
}
#video {
width : 420px;
margin : 0 auto 0 auto;
}
id="video_wrapper"> Présentation de Tristane
id="video"> <object width="320" height="336" class="couv">http://www.dailymotion.com/swf/x3gkgu&related=0">
"
type="application/x-shockwave-flash" width="420" height="336"
allowFullScreen="true"
allowScriptAccess="always"></object>
<!---->
Interview réalisée par AUTEURS TV - Novembre 2007
et to css, modifié :
#video_wrapper {
width : 100%;
}
#video {
width : 420px;
margin : 0 auto 0 auto;
}
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
cs_mel06
Messages postés
6
Date d'inscription
mardi 27 mai 2008
Statut
Membre
Dernière intervention
26 juin 2008
26 juin 2008 à 23:30
26 juin 2008 à 23:30
Je suis novice et j'ai repris le code d'une autre page de mon site pour l'adapter.
J'ai effectué tes modifs blink mais toujours pareil, et j'ai vérifié il n'y a pas de div non fermées.....
http://www.tristane-banon-officiel.com/index2.php?r=av
Présentation de Tristane
<object width="320" height="336" class="couv">
http://www.dailymotion.com/swf/x3gkgu&related=0">
name="allowFullScreen" value="true">
</object>
Interview réalisée par AUTEURS TV - Novembre 2007
J'ai effectué tes modifs blink mais toujours pareil, et j'ai vérifié il n'y a pas de div non fermées.....
http://www.tristane-banon-officiel.com/index2.php?r=av
Présentation de Tristane
<object width="320" height="336" class="couv">
http://www.dailymotion.com/swf/x3gkgu&related=0">
name="allowFullScreen" value="true">
</object>
Interview réalisée par AUTEURS TV - Novembre 2007
Bling 182
Messages postés
510
Date d'inscription
lundi 27 novembre 2006
Statut
Membre
Dernière intervention
5 juillet 2009
3
27 juin 2008 à 00:14
27 juin 2008 à 00:14
Le probleme vient de ta div "middle"
A cause des margin, la largeur de cette div est au maxi de 400 et quelques px (environ, j'ai pas fait les calculs exacts, mais en gros, c'est du 860px - 450px)
C'est le fouillis dans ton code aussi... Tu spécifies des tailles de 320px en largeur, et dedans tu mets du contenu de largeur 420px...
Donc pour info, la div "video" est bien centrée, elle est meme plus grande que la div qui la contient (calcul plus haut), c'est l'objet a l'intérieur qui n'est plus centré maintenant...
A cause des margin, la largeur de cette div est au maxi de 400 et quelques px (environ, j'ai pas fait les calculs exacts, mais en gros, c'est du 860px - 450px)
C'est le fouillis dans ton code aussi... Tu spécifies des tailles de 320px en largeur, et dedans tu mets du contenu de largeur 420px...
Donc pour info, la div "video" est bien centrée, elle est meme plus grande que la div qui la contient (calcul plus haut), c'est l'objet a l'intérieur qui n'est plus centré maintenant...
