Problème de positionnement CSS

sumator Messages postés 4 Date d'inscription Statut Membre Dernière intervention -
inspiring Messages postés 1813 Date d'inscription Statut Membre Dernière intervention - 3 juin 2013 à 18:15

Bonjour à tous,

J'ai un petit soucis de positionnement. En effet, je suis en train de coder une petite page toute simple, mais je me retrouve avec un soucis de positionnement sur une Div. Mon but étant d'avoir une page avec trois div positionné cote à cote. Voici mon code:

<!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=UTF-8" />
<title>Document sans nom</title>

<style type="text/css">

#fond {
	visibility:visible;
	width:980px;
	height:600px;
	background-color:#FFFFFF;
	margin-right: auto;
	margin-left: auto;
	margin-top:100px;
}

#menu {
	visibility:visible;
	position:relative;
	width:180px;
	height:100%;
	z-index:1;
	font-family:"Helvetica Neue", "Helvetica Neue Light";
	font-size:10px;
	font-style:italic;
	float:left;
}

#corp {
	visibility:visible;
	position:relative;
	width:550px;
	height:600px;
	z-index:2;
	font-family:"Helvetica Neue", "Helvetica Neue Light";
	font-size:10px;
	font-style:italic;
	overflow:auto;
	top:0px;
	left:20px;
}

#logo {
	visibility:visible;
	position:relative;
	width:180px;
	height:40px;
	top:0px;
	left:0px;
}

a:link {
	color: #000000;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #000000;
}
a:hover {
	text-decoration: none;
	color: #999999;
}
a:active {
	text-decoration: none;
	color: #000000;
}

</style>

</head>

<body>
	<div id="fond">
    	<div id="menu" align="left" >
       	  <div id="logo"><a href="index.html"><img src="images/Logo.jpg" width="180" height="40" /></a></div>
            <table width="180" border="0">
            	<tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td><a href="webpages/neolithic.html">NEOLITHIC</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/the_gardeners_choice_chair.html">THE GARDENER'S CHOICE CHAIR</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/brass_ensemble.html">BRASS ENSEMBLE</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/precious_chair.html">PRECIOUS CHAIR</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/scacciapensieri.html">SCACCIAPENSIERI</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/fake_castiglioni.html">FAKE CASTIGLIONI</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/glass type.html">GLASS TYPE</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/tensor voting.html">TENSOR VOTING</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/tudo a mao.html">TUDO A MAO</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/zen tools.html">ZEN TOOLS</a></td>
			    </tr>
                <tr>
       			<td><a href="webpages/vallemaggia.html">VALLEMAGGIA (research project)</a></td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr><tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td>&nbsp;</td>
			    </tr>
                <tr>
       			<td height="5">&nbsp;</td>
			    </tr>
                <tr>
       			<td>Giulio Parini<br />
				7, rue E. Racine, 1207 Genève<br />
				Switzerland</td>
			    </tr>
                <td><a href="mailto:giuliomoore@sunrise,ch">giuliomoore@sunrise.ch</a><br />
				0041.79.274.44.12</td>
			    </tr>
            </table>
        	</div>
       </div>
      <div id="corp">
      sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjd sdhskjd sdhskjdsdhskjdsdhskjdsdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjd sdhskjdsdhskjd sdhskjdsdhskjdsdhskjd 
      </div>
    </div>
 </body>
</html>

Seulement, voici le résultat lorsque je l'ouvre sur mon navigateur:

http://imageshack.com/f/nqcapturedecran20130603a1p

Afficher la suite

A voir également:

Problème de positionnement CSS
Logiciel positionnement gratuit - Guide
Exemple test de positionnement greta - Forum Études / Formation High-Tech
Enlever le soulignement d'un lien css - Astuces et Solutions
Css exposant ✓ - Forum CSS
Enlever trait sous un lien href ✓ - Forum Webmastering

2 réponses

Réponse 1 / 2

Profil bloqué

Salut,

Je n'ai pas compris ce que tu souhaites (les tableaux ne s'utilisent plus vraiment en css pour faire le design), mais globalement, on utilise des div auxquelles on mets un width et un position:relative; et un float:left par exemple.

Réponse 2 / 2

inspiring Messages postés 1813 Date d'inscription Statut Membre Dernière intervention 265

A la base, il te faut un conteneur qui englobe tes 3 div et ensuite positionner chacune de tes div avec une propriété float:left
faire attention au parametre tel que le width et l'overflow

Discussions similaires

tests du greta

Xiaomi/Redmi - problème de réseau et SMS de positionnement

test greta

Formation secrétaire comptable niveau IV

images seulement le cadre sans images dans word

Votre réponse

Discussions similaires