Positionnement html
ickyknox
Messages postés
1156
Date d'inscription
Statut
Membre
Dernière intervention
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour,
sur mon site :
ile-du-bien-etre.com
j'ai bien réussi à positionner mes éléments.
Seulement, j'ai utilisé des POSITION : RELATIVE
Mais que pour réussir à placer mes SPAN, j'ai meme du utiliser des TOP et LEFT en NÉGATIF !!
JE TROUVE ceci pas normal, et je fais donc appel à vos lumières pour me dire si je peux y remedier ou si c'est normal ?
je vous remercie !
Voyez mon code au niveau du BOUTON 1 :
sur mon site :
ile-du-bien-etre.com
j'ai bien réussi à positionner mes éléments.
Seulement, j'ai utilisé des POSITION : RELATIVE
Mais que pour réussir à placer mes SPAN, j'ai meme du utiliser des TOP et LEFT en NÉGATIF !!
JE TROUVE ceci pas normal, et je fais donc appel à vos lumières pour me dire si je peux y remedier ou si c'est normal ?
je vous remercie !
Voyez mon code au niveau du BOUTON 1 :
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Plénitude Beauté 06 Cannes - Soins esthétiques à domicile</title>
<meta name = "description" content = "sur Cannes et environs. Massages, épilations, soins visage, maquillage et manucure-pédicure."/>
<meta name="Identifier-URL" content ="www.plenitude-beaute06.com"/>
<meta name="keyboards" content ="massage, massages, masseuse épilation, soin visage, maquillage, maquilleuse, manucure, pédicure, à domicile, cannes, antibes, la bocca, 06, 83, alpes maritimes, var "/>
<link href="style.css" rel="stylesheet" type="text/css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#toggler").click(function() {
event.preventDefault();
$(this).next('.expand').slideToggle("slow");
});
});
</script>
<style type="text/css">
#logo { float: right; top:0px; width:370px; height:90px; z-index:1;}
#accueil { position:absolute; top:170px; width:860px; height:30px; z-index:1;}
#carrousel {
width: 845px;
height: 360;}
#defilement { float: left; top:615px; width:261px; height:436px; z-index:1;}
#cadeau { position:absolute; top:1055px; width:829px; height:167px; z-index:2;}
.ombrage {
box-shadow: 1px 1px 12px #555;
}
</style>
</head>
<body>
<div class="container">
<div class="header">
<!-- LOGO -->
<div id="logo">
<a href="http://plenitude-beaute06.com" style="color:#9E2A95;text-decoration:none;font-size:48px;float: right;">Plénitude Beauté</a><br>
<a href="http://plenitude-beaute06.com" style="color:#9E2A95;text-decoration:none;font-size:25px;line-height:10px;float: right;">Esthétique et bien-etre à domicile</a><br>
<a href="http://plenitude-beaute06.com" style="color:#BED58E;text-decoration:none;font-size:32px;line-height:50px;float: right;">Soins aux produits de la mer</a>
</div>
<!-- BOUTONS ACCUEIL -->
<div id="accueil" class="font1">
<center>
<a href="http://plenitude-beaute06.com" style="color:black;;text-decoration:none">ACCUEIL</a>
<a href="http://plenitude-beaute06.com" style="color:black;;text-decoration:none">BLOG</a>
<a href="http://plenitude-beaute06.com" style="color:black;;text-decoration:none">CONTACT</a>
<a href="http://plenitude-beaute06.com" style="color:black;;text-decoration:none">PARRAINAGE</a>
<a href="http://plenitude-beaute06.com" style="color:black;;text-decoration:none">PRODUITS</a>
<a href="http://plenitude-beaute06.com" style="color:black;;text-decoration:none">PARTENAIRES</a>
</center>
</div>
</div>
<div class="content">
<!-- CAROUSEL -->
<span id="carrousel" style="position: relative; top: 0px;left:5px;">
<param name="movie" value= "carrousel/index.html" />
<param name="quality" value="high" />
<embed src="carrousel/index.html" width="845px" height="360px" quality="high">
</span>
<!-- BIENVENUE -->
<div id="bienvenue" class="bienvenue" style="position: relative; top: 0px;left:5px;">
<table><tr><td background="images/bienvenue.png" style="background-repeat: no-repeat;">
<center>
<p class="font2">Bienvenue</p>
<a class="font3">Plénitude Beauté vous propose des prestations de qualité à<br> domicile sur Cannes et environs<br><br>
Sur rendez-vous, tous les jours <br>de 9h à 20h.<br><br>
Téléphone : 06 61 87 83 65<br>
plenitude-beaute@laposte.net<br>
Rejoignez-nous sur <br></a>
<a href="https://www.facebook.com/login/?next=https%3A%2F%2Fwww.facebook.com%2Fplenitudebeaute"><img src="images/facebook.png" width="44px" height="44px" alt="facebook"/></a>
</center>
</td></tr></table
></div>
<!-- BOUTON 1 -->
<div class="ombrage" style=" width:87px;height:87px; position: relative; top: -350px; left:300px;">
<span><param name="movie" value= "icone/index1.html" />
<embed src="icone/index1.html" quality="high"></span>
</div>
<!-- BOUTON 2 -->
<!--<div style=" width:87px;height:87px; position: relative; top: -320px; left:300px;">
<div class="ombrage">
<a><param name="movie" value= "icone/index2.html" />
<embed src="icone/index2.html" quality="high"></a>
</div>
</div>
<!-- BOUTON 3 -->
<!-- <div style=" width:87px;height:87px; position: relative; top: -290px; left:300px;">
<div class="ombrage">
<a><param name="movie" value= "icone/index3.html" />
<embed src="icone/index3.html" quality="high"></a>
</div>
</div>
<!-- CADEAU -->
<span id="cadeau" class="cadeau" style="position: relative; top: -90px;left:5px;"><IMG SRC="images/cadeau.png"></span>
<span id="cadeau" class="font2" style="position: relative; top: -250px;left:60px;height:50px;">Carte cadeau</span>
<span id="cadeau" class="font3" style="position: relative; top: -225px;left:120px;height:70px;width:520px;" >Pour un événement ou simplement pour faire plaisir, pensez à <br> offrir une carte cadeau. Elle est valable sur toutes les prestations <br> pendant 6 mois.</span>
A voir également:
- Positionnement html
- Editeur html - Télécharger - HTML
- Logiciel positionnement gratuit - Guide
- Espace html - Astuces et Solutions
- Br html ✓ - Forum Webmastering
- Exemple test de positionnement greta - Forum Études / Formation High-Tech
