vue positionnement en html5 - Page 2
Kommunauty
Connexion
Inscription

Forum Programmation positionnement en html5

positionnement en html5


Homer Messages : 1925

Tout dépend si ta div footer est dans ta div corps ou pas

<body>
<div id="corps">
<div id="footer"></div>
</div>
</body>

Dans ce cas footer vaut 80% des 80% ...


<body>
<div id="corps"></div>
<div id="footer"></div>
</body>

dans ce cas footer vaut 80%
vendredi 21 novembre 2014 (Dernière édition vendredi 21 novembre 2014)

OaladesSomatesTignon Messages : 292

Et avec LESS, c'est plus faisable ? Jamais utilisé.
samedi 22 novembre 2014

Homer Messages : 1925

L’intérêt du LESS c'est le côté dynamique, là en l’occurrence, c'est un réglage unique pour tous donc un simple css suffit amplement.
samedi 22 novembre 2014

jeandub Messages : 151

C'est quoi LESS ?

Sinon OK j'ai compris l'histoire des pourcentages.

Autre chose : j'ai une div "bannière" et en CSS j'ai mis un background-image" . Comment faire pour que ce background s'adapte lui aussi à la largeur d'écran en respectant ses proportions hauteur-largeur ?
dimanche 23 novembre 2014 (Dernière édition dimanche 23 novembre 2014)

Homer Messages : 1925

LESS c'est pour générer du css dynamiquement, et pouvoir utiliser plusieurs version d'une même classe.

Essaie la propriété background-size : cover;

J'ai un doute mais je crois que pour une div en %, il y a des soucis d'affichages.

Peut tu donner le code de la div, se sera plus simple

dimanche 23 novembre 2014 (Dernière édition dimanche 23 novembre 2014)

jeandub Messages : 151

ça s'écrit comment en css pour un background-image ? background-image-size ?
dimanche 23 novembre 2014

Homer Messages : 1925

http://www.w3schools.com/cssref/css3_pr_background-size.asp
dimanche 23 novembre 2014

jeandub Messages : 151

Bon, j'ai vraiment un problème avec le positionnement :

J'ai mis le bas de page en relative et les deux images (id = appdiv) en absolute.

mais ça ne marche pas si je réduis la taille de l'écran : l'image de droite part du pied de page (vers la droite) . J'ai mis le bas de page en width: 100%.

De plus la hauteur du pied de page s'est réduite et le texte n'est plus centré verticalement.

Où est l'erreur ?

#pied_de_page
{
	position: relative;
	width: 100%
	height : 209px;
	background : url("design/pied_de_page.png") center;
	text-align : center;
	padding-top : 41px;
	color : #000000;
	clear : both;
	border-radius: 5px;
}

#pied_de_page a
{
	color : #000000;
}

#apDiv4
{
	position: absolute;
	width: 74px;
	height: 79px;
	z-index: 1;
	left: 5px;
	top: 10px;
}
#apDiv5
{
	position: absolute;
	width: 48px;
	height: 79px;
	z-index: 2;
	left: 1175px;
	top: 10px;
}

<div id="pied_de_page">© La Baraque TV
	<div id="apDiv5"><img src="../design/logo.jpg" alt="logo la baraque TV" width="48" height="79" /></div>
	<div id="apDiv4"><img src="../design/le-creusot-logo-web.jpg" width="74" height="79" alt="logo le creusot" /></div>
	</div>
	</div>

Et si je mets #apDiv5 en float: right elle ne flotte pas à droite mais à gauche du pied de page!!
dimanche 23 novembre 2014 (Dernière édition dimanche 23 novembre 2014)

Homer Messages : 1925

essai ça :


#apDiv5
{
	position: absolute;
	width: 48px;
	height: 79px;
	z-index: 2;
	[color=#9e141c]right: 5px;[/color]
	top: 10px;
}

Si tu peux un left:1175px, forcément ça dépasse du cadre, alors que si tu le place par rapport à la droite, quoi que tu fasse, il sera toujours là ou il faut.
dimanche 23 novembre 2014

jeandub Messages : 151

Merci Homer, mais j'ai trouvé la solution : j'ai enlevé les <div> qui contenaient les images et j'ai réussi à caler mon pied-de page avec left et right 5px.

Je ne sais pas ce qui gênait avec les <div>

En tout cas merci de ton aide
lundi 24 novembre 2014 (Dernière édition lundi 24 novembre 2014)

Répondre Pour répondre, tu dois d'abord t'inscrire rapidement sur Kommunauty. Rejoins-nous vite !
Pages : 012

Forum Programmation positionnement en html5

Kommunauty © Tous droits réservés Contact / Charte & Mentions légales / Hebergement gratuit / Bon plan hébergement / Aide B2i

RSS