Espacer video you tube sur site internet pers
Fermé
artentica
Messages postés
72
Date d'inscription
dimanche 8 janvier 2012
Statut
Membre
Dernière intervention
24 août 2015
-
14 juil. 2012 à 14:38
artentica Messages postés 72 Date d'inscription dimanche 8 janvier 2012 Statut Membre Dernière intervention 24 août 2015 - 27 juil. 2012 à 01:50
artentica Messages postés 72 Date d'inscription dimanche 8 janvier 2012 Statut Membre Dernière intervention 24 août 2015 - 27 juil. 2012 à 01:50
A voir également:
- Espacer video you tube sur site internet pers
- Site de telechargement - Guide
- Recuperer video youtube - Guide
- Site inaccessible - Guide
- Site de vente entre particulier - Guide
- Gps sans internet - Guide
10 réponses
Nyctaclope
Messages postés
5315
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
11 décembre 2022
1 250
Modifié par Nyctaclope le 15/07/2012 à 14:38
Modifié par Nyctaclope le 15/07/2012 à 14:38
Bonjour
Si ce n'est pas confidentiel, fournis nous le lien vers ton site ..
En inspectant le code, et s'il est assez lisible, on pourra peut être voir ce qui cloche .
A+
Nyctaclope
Le plus joli des poèmes de la mathématique : e^(i.PI)=i^2
trois nombres "sacrés" d'horizons différents qui se donnent la main ...
Si ce n'est pas confidentiel, fournis nous le lien vers ton site ..
En inspectant le code, et s'il est assez lisible, on pourra peut être voir ce qui cloche .
A+
Nyctaclope
Le plus joli des poèmes de la mathématique : e^(i.PI)=i^2
trois nombres "sacrés" d'horizons différents qui se donnent la main ...
Nyctaclope
Messages postés
5315
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
11 décembre 2022
1 250
Modifié par Nyctaclope le 18/07/2012 à 22:55
Modifié par Nyctaclope le 18/07/2012 à 22:55
Bonsoir
Désolé du retard , suite à des imprévus ..
Très bonne présentation de ton site ! ..
Pour ton problème de décalage de la première video, il vient de la largeur déclarée pour ton sommaire :
Dans ton presentation.css (ligne 101)
#sommaire
tu devrais mettre width: 9.5% et non 16%
et alors cela tombe juste , j'ai testé ....
Il faut alors que tu revoies les textes du sommaire qui s'affichent souvent sur deux lignes :
réduire la taille de police ?
ou plutôt déclarer une marge de gauche des <li>
ou mieux : celle du <ul> conteneur des <li>
Si tu veux garder la largeur actuelle du sommaire, il te faudra retoucher un peu la largeur du corps de page :
presentation.css (ligne 73)
#corps_de_page
margin: auto; ??
width: 66%; à revoir et diminuer, les videos doivent pouvoir encore passer dedans
Pas trop pu aller plus loin, faute de temps ..
Nota : en tête de ton code, il te manque une déclaration de type :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/
A+
Nyctaclope
Le plus joli des poèmes de la mathématique : e^(i.PI)=i^2
trois nombres "sacrés" d'horizons différents qui se donnent la main ...
Désolé du retard , suite à des imprévus ..
Très bonne présentation de ton site ! ..
Pour ton problème de décalage de la première video, il vient de la largeur déclarée pour ton sommaire :
Dans ton presentation.css (ligne 101)
#sommaire
tu devrais mettre width: 9.5% et non 16%
et alors cela tombe juste , j'ai testé ....
Il faut alors que tu revoies les textes du sommaire qui s'affichent souvent sur deux lignes :
réduire la taille de police ?
ou plutôt déclarer une marge de gauche des <li>
ou mieux : celle du <ul> conteneur des <li>
Si tu veux garder la largeur actuelle du sommaire, il te faudra retoucher un peu la largeur du corps de page :
presentation.css (ligne 73)
#corps_de_page
margin: auto; ??
width: 66%; à revoir et diminuer, les videos doivent pouvoir encore passer dedans
Pas trop pu aller plus loin, faute de temps ..
Nota : en tête de ton code, il te manque une déclaration de type :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/
A+
Nyctaclope
Le plus joli des poèmes de la mathématique : e^(i.PI)=i^2
trois nombres "sacrés" d'horizons différents qui se donnent la main ...
Je te remercie pour ta réponse et tus le travail quetu t'es donnés j'ai changé la présentation du site au niveau du sommaire mais je n'ai cependant pas réussis à mettre sur une seul ligne les liens. Et je n'arrive pas non plus à séparer les vidéos, elles restent collés. Je te remerci encore une fois de m'avoir réponu et si tu veux bien continuer à m'aider j'en serai plus que ravie.
Nyctaclope
Messages postés
5315
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
11 décembre 2022
1 250
20 juil. 2012 à 22:52
20 juil. 2012 à 22:52
Bonsoir
1// D'abord une petite remarque ( gentille, pardonne la moi .. ) :
il y a quelques petites fautes d'orthographe que tu n'as pas encore eu le temps de voir, cela passe quand même ( cela arrive souvent ), mais il faut absolument qu'au moins dans ton menu tu corriges "Page d'accueil" où le "u" est mal placé, car cela "arrache" un peu dans un site plutôt bien présenté par ailleurs ..
2// Ensuite dans ta <div>id="corps_de_page", dans la <div> "fille" suivante le contenu "style" de la balise <object> n'est pas catholique :
<object style=" height:="" 390px;="" width:="" 640px;"="">
et tu n'as pas de balise de fermeture </object>, alors que dans les <object> suivants tu fermes ..
Je ne connais pas cette balise, n'ayant pas eu l'occasion de jouer à des insertions de vidéos, et je n'ai pas eu le temps de vérifier le bon usage.
En tout cas cela marche bien dans les suivants, apparemment il faut fermer ..
3// pour séparer tes videos, il faut ( par exemple ) utiliser un saut de ligne <br />
Voir un peu plus bas..
Ici la bonne syntaxe est <br /> , remplaçant l'ensemble théorique des balises d'ouverture et de fermeture . Cette syntaxe est la nouvelle recommandée pour HTML5, or tu es en HTML5, car tu utilises la nouvelle balise <nav>
Pour la séparation , APRES chaque balise de fermeture </object>, insère ainsi :
<br /><hr /><br />
qui insère en plus ( par exemple ) une ligne horizontale ( <hr /> est je crois la bonne syntaxe, mais <hr> passe aussi )
Voilà ce que cela donne :
http://img1.imagilive.com/0712/Separation_video.JPG
tu peux aussi doubler les <br /> ou supprimer le dernier après <hr />, à toi d'essayer des variantes ..
4// pour ton sommaire et le positionnement des textes, je t'ai trouvé une solution, mais j'ai travaillé en vitesse à la volée, et n'ai pas pris de notes.
Le problème est que tes attributs sont hérités des balises contenantes précédentes, ou des définitions générales du fichier CSS.
Il faut que tu crées une exception pour l'élément considéré, soit dans le code, soit dans le CSS
Je dois pouvoir te retrouver cela pour demain, et te donner les précisions correspondantes.
J'espère retrouver la manip, pas de souci ..
A+
Nyctaclope
1// D'abord une petite remarque ( gentille, pardonne la moi .. ) :
il y a quelques petites fautes d'orthographe que tu n'as pas encore eu le temps de voir, cela passe quand même ( cela arrive souvent ), mais il faut absolument qu'au moins dans ton menu tu corriges "Page d'accueil" où le "u" est mal placé, car cela "arrache" un peu dans un site plutôt bien présenté par ailleurs ..
2// Ensuite dans ta <div>id="corps_de_page", dans la <div> "fille" suivante le contenu "style" de la balise <object> n'est pas catholique :
<object style=" height:="" 390px;="" width:="" 640px;"="">
et tu n'as pas de balise de fermeture </object>, alors que dans les <object> suivants tu fermes ..
Je ne connais pas cette balise, n'ayant pas eu l'occasion de jouer à des insertions de vidéos, et je n'ai pas eu le temps de vérifier le bon usage.
En tout cas cela marche bien dans les suivants, apparemment il faut fermer ..
3// pour séparer tes videos, il faut ( par exemple ) utiliser un saut de ligne <br />
Voir un peu plus bas..
Ici la bonne syntaxe est <br /> , remplaçant l'ensemble théorique des balises d'ouverture et de fermeture . Cette syntaxe est la nouvelle recommandée pour HTML5, or tu es en HTML5, car tu utilises la nouvelle balise <nav>
Pour la séparation , APRES chaque balise de fermeture </object>, insère ainsi :
<br /><hr /><br />
qui insère en plus ( par exemple ) une ligne horizontale ( <hr /> est je crois la bonne syntaxe, mais <hr> passe aussi )
Voilà ce que cela donne :
http://img1.imagilive.com/0712/Separation_video.JPG
tu peux aussi doubler les <br /> ou supprimer le dernier après <hr />, à toi d'essayer des variantes ..
4// pour ton sommaire et le positionnement des textes, je t'ai trouvé une solution, mais j'ai travaillé en vitesse à la volée, et n'ai pas pris de notes.
Le problème est que tes attributs sont hérités des balises contenantes précédentes, ou des définitions générales du fichier CSS.
Il faut que tu crées une exception pour l'élément considéré, soit dans le code, soit dans le CSS
Je dois pouvoir te retrouver cela pour demain, et te donner les précisions correspondantes.
J'espère retrouver la manip, pas de souci ..
A+
Nyctaclope
artentica
Messages postés
72
Date d'inscription
dimanche 8 janvier 2012
Statut
Membre
Dernière intervention
24 août 2015
1
21 juil. 2012 à 01:47
21 juil. 2012 à 01:47
Je te remercie vraiment pour ton execellante aide que tu m'apporte là, je te remercie grandement car je trouve que tes explications sont vraiment bonnes et que t'es solutions sont illustrés. Encore uen fois merci.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Nyctaclope
Messages postés
5315
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
11 décembre 2022
1 250
22 juil. 2012 à 22:51
22 juil. 2012 à 22:51
Bonsoir
Toujours en retard ..
En ce qui concerne cette fois la mise en forme des textes dans ton sommaire :
Bon, la chose est faite, et voila ce que cela donne depuis mon simulateur ( je n'ai bien sûr pas touché à ton code réel ! ) :
http://img1.imagilive.com/0712/Page_bonus_finale.JPG
J'espère que cela te convient ..
Je suis trop juste en temps ce soir, et te donne donc très prochainement le détail des modifs.
Mais voici les explications préalables :
Tes textes du menu #sommaire ( dans les <li> ) sont écrasés faute de place en latéral.
Pour récupérer de la place, cela se fait essentiellement en diminuant les padding-left et -right ( on ne touche pas aux -top et -bottom ):
1// de l'élément <ul> qui contient les <li> ( on ne touche pas au CSS des <li> , qui vont donc hériter des paddings du <ul> ).
Mais comme il y a déjà une déclaration CCS pour les <ul> en général, on limite la déclaration à un <ul> seulement contenu dans un élément #sommaire, pour ne pas perturber les autres <ul>
Ici, il y a un petit problème, car le padding-left d'un <ul> est par défaut de 40 px, et on force à une autre valeur. Il faut choisir une valeur mini de 20px, sinon les "puces" sortent à gauche du sommaire ..
2// de l'élément #sommaire
On garde les paddings -top et -bottom qui ne gênent pas, mais on passe à zéro les paddings -left et -right
Cette récupération des paddings obligent à corriger et augmenter la valeur de width, qui est la largeur du contenu. De 9.5% on passe donc à 15%.
Il y a ainsi des modifs et des rajouts à faire dans ton CSS ..
Le détail suit, j'espère demain ..
A+
Nyctaclope
Toujours en retard ..
En ce qui concerne cette fois la mise en forme des textes dans ton sommaire :
Bon, la chose est faite, et voila ce que cela donne depuis mon simulateur ( je n'ai bien sûr pas touché à ton code réel ! ) :
http://img1.imagilive.com/0712/Page_bonus_finale.JPG
J'espère que cela te convient ..
Je suis trop juste en temps ce soir, et te donne donc très prochainement le détail des modifs.
Mais voici les explications préalables :
Tes textes du menu #sommaire ( dans les <li> ) sont écrasés faute de place en latéral.
Pour récupérer de la place, cela se fait essentiellement en diminuant les padding-left et -right ( on ne touche pas aux -top et -bottom ):
1// de l'élément <ul> qui contient les <li> ( on ne touche pas au CSS des <li> , qui vont donc hériter des paddings du <ul> ).
Mais comme il y a déjà une déclaration CCS pour les <ul> en général, on limite la déclaration à un <ul> seulement contenu dans un élément #sommaire, pour ne pas perturber les autres <ul>
Ici, il y a un petit problème, car le padding-left d'un <ul> est par défaut de 40 px, et on force à une autre valeur. Il faut choisir une valeur mini de 20px, sinon les "puces" sortent à gauche du sommaire ..
2// de l'élément #sommaire
On garde les paddings -top et -bottom qui ne gênent pas, mais on passe à zéro les paddings -left et -right
Cette récupération des paddings obligent à corriger et augmenter la valeur de width, qui est la largeur du contenu. De 9.5% on passe donc à 15%.
Il y a ainsi des modifs et des rajouts à faire dans ton CSS ..
Le détail suit, j'espère demain ..
A+
Nyctaclope
Nyctaclope
Messages postés
5315
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
11 décembre 2022
1 250
Modifié par Nyctaclope le 23/07/2012 à 22:18
Modifié par Nyctaclope le 23/07/2012 à 22:18
Re
Et voilà les corrections à faire dans ton CSS "presentation.css" :
1// modification :
l'actuel :
#sommaire {
background: none repeat scroll 0 0 #1A1A1A;
border: 8px groove black;
float: left;
margin: 0;
padding: 3%;
width: 9.5%;
}
devient : ( modif en gras )
#sommaire {
background: none repeat scroll 0 0 #1A1A1A;
border: 8px groove black;
float: left;
margin: 0;
padding 3% 0;
width: 15%;
}
2// ajouts dans le CSS , de préférence juste après le paragraphe #sommaire, pour une bonne lisibilité :
#sommaire ul
{
padding-left: 20px;
}
et :
#sommaire h2
{
text-align: center;
}
ce dernier pour un affichage correct centré du titre h2 dans le sommaire ..
Je pense que les explications données plus haut te suffisent ..
Enfin je te rappelle que ta déclaration d'en-tête de ton code :
<!DOCTYPE html>
n'est pas complète ..
Apparemment cela marche comme cela, au moins avec Firefox ..
Mais tu risques peut être des problèmes avec d'autres navigateurs de tes visiteurs.
En particulier, Internet Explorer ( je n'ai pu l'essayer sur ton code, car je l'ai viré depuis de nombreux mois pour incompatibilité d'humeur :) ) au moins sur les anciennes versions, peut poser des problèmes, son interprétation des marges et des paddings n'étant pas conforme aux standards officiels ..
Je t'invite à consulter le site du zéro, et également ceci :
https://www.zonecss.fr/proprietes-css/padding-css.html
Espérant avoir été clair ..
Amuse toi bien ..
A+
Nyctaclope
Le plus joli des poèmes de la mathématique : e^(i.PI)=i^2
trois nombres "sacrés" d'horizons différents qui se donnent la main ...
Et voilà les corrections à faire dans ton CSS "presentation.css" :
1// modification :
l'actuel :
#sommaire {
background: none repeat scroll 0 0 #1A1A1A;
border: 8px groove black;
float: left;
margin: 0;
padding: 3%;
width: 9.5%;
}
devient : ( modif en gras )
#sommaire {
background: none repeat scroll 0 0 #1A1A1A;
border: 8px groove black;
float: left;
margin: 0;
padding 3% 0;
width: 15%;
}
2// ajouts dans le CSS , de préférence juste après le paragraphe #sommaire, pour une bonne lisibilité :
#sommaire ul
{
padding-left: 20px;
}
et :
#sommaire h2
{
text-align: center;
}
ce dernier pour un affichage correct centré du titre h2 dans le sommaire ..
Je pense que les explications données plus haut te suffisent ..
Enfin je te rappelle que ta déclaration d'en-tête de ton code :
<!DOCTYPE html>
n'est pas complète ..
Apparemment cela marche comme cela, au moins avec Firefox ..
Mais tu risques peut être des problèmes avec d'autres navigateurs de tes visiteurs.
En particulier, Internet Explorer ( je n'ai pu l'essayer sur ton code, car je l'ai viré depuis de nombreux mois pour incompatibilité d'humeur :) ) au moins sur les anciennes versions, peut poser des problèmes, son interprétation des marges et des paddings n'étant pas conforme aux standards officiels ..
Je t'invite à consulter le site du zéro, et également ceci :
https://www.zonecss.fr/proprietes-css/padding-css.html
Espérant avoir été clair ..
Amuse toi bien ..
A+
Nyctaclope
Le plus joli des poèmes de la mathématique : e^(i.PI)=i^2
trois nombres "sacrés" d'horizons différents qui se donnent la main ...
artentica
Messages postés
72
Date d'inscription
dimanche 8 janvier 2012
Statut
Membre
Dernière intervention
24 août 2015
1
24 juil. 2012 à 11:05
24 juil. 2012 à 11:05
Nyctaclope je te remercie une nouvelle fois pour toutes tes réponses, c'est dernier temps je suis plutôt occupé donc je regarderai les modifs du sites quand je retrouverai mon pc, encore une fois merci pour ton travail et aurais-tu une solution pour séparer mes videos sur la page bonus?
Nyctaclope
Messages postés
5315
Date d'inscription
dimanche 6 avril 2008
Statut
Membre
Dernière intervention
11 décembre 2022
1 250
Modifié par Nyctaclope le 24/07/2012 à 11:42
Modifié par Nyctaclope le 24/07/2012 à 11:42
Re
Oui, je t'ai donné la solution au 3// de mon post #7 du 20/7, avec l'image du résultat ..
A+
Nyctaclope
Oui, je t'ai donné la solution au 3// de mon post #7 du 20/7, avec l'image du résultat ..
A+
Nyctaclope
artentica
Messages postés
72
Date d'inscription
dimanche 8 janvier 2012
Statut
Membre
Dernière intervention
24 août 2015
1
27 juil. 2012 à 01:44
27 juil. 2012 à 01:44
Bonsoir, je suis de retour parce que même après lesmodifications il me reste quelques problème pour mon sommaire, il n'est pas collé au corps de page et je voudrais pouvoir réduire sa aueur mais je n'arrive pas.
Je donne des remerciments d'avance pour les solutions apporté.
Amicalement Artentica.
Je donne des remerciments d'avance pour les solutions apporté.
Amicalement Artentica.
artentica
Messages postés
72
Date d'inscription
dimanche 8 janvier 2012
Statut
Membre
Dernière intervention
24 août 2015
1
27 juil. 2012 à 01:50
27 juil. 2012 à 01:50
Pour se qui est de l'en tête j'en ai essayé plusieur mais je trouve qu'eles ont toues des répercussions plutôt négative sur ma page internet
Bonjour,
</br> ???
Je pense que la balise est : <br>
</br> ???
Je pense que la balise est : <br>
artentica
Messages postés
72
Date d'inscription
dimanche 8 janvier 2012
Statut
Membre
Dernière intervention
24 août 2015
1
15 juil. 2012 à 20:23
15 juil. 2012 à 20:23
<br> marche peut être je n'ai pas essayé mais </br> comme ça marche en tout cas mais pas pour la video you tube je n'arrive pas à les espacer.
15 juil. 2012 à 20:25
http://serie-en-ligne.olympe.in/bonus_serie.php
merci d'avance pour votre aide