Soucis d'espace + div

st0nky · 11/01/2012, 20h02

Bonjour,

Une paire d'années que je n'ai pas posté et une paire d'années que je n'ai pas codé alors soyez indulgent

.

J'ai un soucis sur lequel je bute depuis 2 jours et je ne comprend pas le comment du pourquoi.

contexte :

J'ai un DIV principal qui englobe tout mon site. et plusieurs DIV à l’intérieur de celle-ci (peut être pas la meilleur solution mais le mal est fait

).

ayant développé mon site sur FIREFOX, TOUT EST NIQUEL.

En revanche j'ai tuilé car j'ai jamais vérifier mon code sous IE du coup je suis en train de reprendre tout mon CSS pour l'adapter au mieux.

Je me retrouve avec des espaces que je n'arrive pas du tout a identifier et j’espère que quelqu'un pourra m'aiguiller au mieux pour pallier à ce soucis.

voici le code de la page ou se trouve le soucis:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
 
<?php
?>
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
	<HTML>
		<HEAD>
				<TITLE>Cigarette électronique H&C</TITLE>
				<link rel='stylesheet' type='text/css' href='style_ie.css'/>
				<link rel="Shortcut Icon" href="images/icone.ico" type="image/x-icon" />
				<meta name="description" content="H&C est une société qui vous propose des produits vous permettant de fumer plus sainement. Ainsi vous pourrez trouver sur notre site des kits de cigarette électronique, des recharges pour cigarettes électroniques, des recharges pour cigarettes électroniques, des chargeur pour cigarettes électroniques, des eliquide pour cigarette électroniques et d'autres accessoires pour cigarettes électroniques" />
				<meta name="keywords" content="cigarette électronique, ecigarette électronique, ecig h&c, ecig électronique, cigarette électronique h&c, ecigarette electronique h&c, atomiseur, fiole h&c, eliquid h&c, kits pour cigarette électronique h&c, kits ego h&c, kits joye 510 h&c, kits spécial 510 h&c, cartomiseur" />
				<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
				<SCRIPT LANGUAGE="Javascript" SRC="disclaimer.js"></SCRIPT>
				<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
				<script type="text/javascript" src="simplegallery.js"></script>
 
				<script type="text/javascript" src="arrondi.js"></script>
				<script type="text/javascript">
 
				var mygallery=new simpleGallery({
					wrapperid: "simplegallery1", //ID of main gallery container,
					dimensions: [650, 380], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
					imagearray: [
						["images/new_year.jpg", "http://en.wikipedia.org/wiki/Swimming_pool", "_new", "Bonne année 2012 à tous :)."],
						["images/facebook_affiche.png", "http://en.wikipedia.org/wiki/Cave", "", "rejoignez notre groupe"],
						["images/promotion.png", "", "", "Bienvenue à tout nos nouveaux clients"],
						["images/parrainage.png", "", "", "Tout le monde est récompensé"]
					],
					autoplay: [true, 3000, 2], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
					persist: false, //remember last viewed slide and recall within same session?
					fadeduration: 500, //transition duration (milliseconds)
					oninit:function(){ //event that fires when gallery has initialized/ ready to run
						//Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
					},
					onslide:function(curslide, i){ //event that fires after each slide is shown
						//Keyword "this": references current gallery instance
						//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
						//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
					}
				})
 
				</script>
 
		</HEAD>
				<BODY>
 
		<div id="page">
				 <div class="arrondi">
				 	<?php include("entete.php");
						  include("menu.php");
						  include("menu_prod.php");
						  include("panier.php");
						  include("cadre_eco.php");
					      include("paypal.php");
						  include("tag.php");
						  include("facebook.php");?>
					<div class="accueil">
						<div id="simplegallery1"> </div>
						<h2> bienvenue dans l'univers H&C</h2>
						<table id="box1" border="1">
							<tr>
								<td>
							<?php 
 
								echo "<a href='product.php?nom_prod=".$handc."' title='".$data[0]."'><h3>".$data[0]."</h3></a></br></br>";
								echo "<a href='product.php?nom_prod=".$handc."' title='".$data[0]."'><img src='images/products/".$data[1].".jpg' border='0' width='100' alt='".$data[0]."'></a></br>";
								echo "<a href='product.php?nom_prod=".$handc."' title='".$data[0]."'>".$data[2]."</a>";
							?>
								</td>
							</tr>
						</table>
						<table id="box3" border="1">
							<tr>
								<td>
							<?php 
								echo "<a href='product.php?nom_prod=".$handc."'><h3>".$data[0]."</h3></a></br></br>";
								echo "<img src='images/products/".$data[1].".jpg' width='100'></br>";
								echo "<a href='product.php?nom_prod=".$handc."'>".$data[2]."</a>";
							?>
								</td>
							</tr>
						</table>
					</div>
				</div>	
				<?php include("menu_bottom.php");?>
		</div>
				</BODY> 
	</HTML>

(j'ai zappé le code PHP c'est pas le problème)

voici mon code CSS pour chaque élément :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
 
body {
	width:100%
	color:black;
	font-family: "palatino linotype", Arial, Verdana, serif;
	}
 
div.arrondi
      {
	width:85%;
	position:aboslute;
	background:white;
	border: 1px solid #A7B2B0 ;
	box-shadow: 8px 8px 12px 0 rgba(0, 0, 0, 0.5);
	margin-left:16%;
	border-radius:100px;
     }
div.accueil
{
	width:60%;
	position:relative;
	top:-42%;
	margin-left:22%;
	border : 1px solid blue;
}

Il y a beaucoup de code alors je ne sais pas ce que vous voudriez voir apparaître du coup je vous met le lien pour que vous vous rendiez compte de la situation.

Sortez moi de la vie, je vous écris ce post du haut de mon balcon alors évitez que je saute !!

le lien de la page : http://healthandcig.eu/ie/ (donc a ouvrir avec IE

on peut voir un espace entre les 3 petit bloc qui présente des produits et un espace gigantesque entre la div acceuil et la fin de la div arrondi !! Comprend pas !!

Cordialement

ps: si il vous faut plus de code, dite moi !!!

coshibe · 12/01/2012, 10h07

Premier petit élément de réponse :

Je te déconseille très fortement d'utiliser des pourcentages dans ton CSS. des pixels ou des mm ce sera toujours mieux, car d'une aprt c'est plus facile à controler et à analyser. Change ca et je pense que tu auras deja une nette amélioration sous IE.

st0nky · 12/01/2012, 12h45

Merci pour ta réactivité...

J'ai utilisé les pourcentage car j'avais lu quelque part que c'était plus simple pour la compatibilité selon la résolution... Peut être cela n'a rien avoir mais je vais partir sur cette piste.

Je comprend pas pourquoi tout roule avec Mozilla alors que ça devrait être le contraire...

12/01/2012, 10h07	#2
coshibe Membre éclairé Sébastien Bredele Développeur Java Inscription : septembre 2011 Messages : 167 Détails du profil Informations personnelles : Nom : Sébastien Bredele Localisation : France, Nord (Nord Pas de Calais) Informations professionnelles : Activité : Développeur Java Secteur : Service public Informations forums : Inscription : septembre 2011 Messages : 167 Points : 376 Points : 376	Premier petit élément de réponse : Je te déconseille très fortement d'utiliser des pourcentages dans ton CSS. des pixels ou des mm ce sera toujours mieux, car d'une aprt c'est plus facile à controler et à analyser. Change ca et je pense que tu auras deja une nette amélioration sous IE.
	00

12/01/2012, 12h45	#3
st0nky Invité de passage Inscription : juin 2005 Messages : 16 Détails du profil Informations forums : Inscription : juin 2005 Messages : 16 Points : 4 Points : 4	Merci pour ta réactivité... J'ai utilisé les pourcentage car j'avais lu quelque part que c'était plus simple pour la compatibilité selon la résolution... Peut être cela n'a rien avoir mais je vais partir sur cette piste. Je comprend pas pourquoi tout roule avec Mozilla alors que ça devrait être le contraire...
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email