Problème création site HTML

Sphax973 Messages postés 3 Date d'inscription Statut Membre Dernière intervention -
powerguitou Messages postés 472 Date d'inscription Statut Membre Dernière intervention - 22 janv. 2013 à 14:04

Bonjour,

Alors voila, actuellement en terminale S spé SI, nous devons preparer un projet pour la fin d'année. Dans mon groupe je suis celui qui s'occupe de la mise en place du site. Et je rencontre un sacré problème, assez embêtant.. Le problème pourrait être simple pour certain d'entre vous ^^. Lorsque que vous enregistrez les lignes de code ci-dessous, vous obtenez un site avec un tableau et plusieurs inscriptions dans 2 colonnes différentes. J'ai réussi a tout centrer dans la colonne de droite, mais je ne trouve pas comment faire dans la colonne de gauche..

Voici les lignes de codes :

<html>

<table border="3" bordercolor="black" cellpadding="12" align="center">
<tr>
<th align="center" heigth="50">Status Relay</th>
<th align="center" height="50">On Off</th>
</tr>
<tr>
<td height="120" width="195"><div id="content">

<div id="status">
<div id="loading" style="display:none">Error:<br />Connection to relay board was lost.</div>
<div id="display">

<p><br />
<p class="exercise"><b>Relay 1-2</b></p>
<span style="float:center;height: 10px;font-size:11px;font-weight:bold;margin-left:12px">Lumières <font color="white">- -</font> Climatisation</span>

<p><br />
<span class="leds">
<a id="led0" onclick="newAJAXCommand('leds.cgi?led=0');">*</a>
<a id="led1" onclick="newAJAXCommand('leds.cgi?led=1');">*</a>
</span></p>

<p><br />
<p><br />
</td>
<td height="120" width="200" align="center"><p class="exercise"><b>Channels 1-2 </b><span style="margin-left:100px;"></span></p>

<div class="examplebox">
<span style="float:center;height: 10px;font-size:11px;font-weight:bold;margin-left:12px">Lumières <font color="white">- -</font> Climatisation</span>

<p>
<INPUT type="button" value="On" style="width:40px;margin-left:4px;" name="led1" ~ledSelected(0,TRUE)~ onclick="window.location='preset.htm?led1=1';"/>
<INPUT type="button" value="On" style="width:40px;margin-left:36px;" name="led2" ~ledSelected(1,TRUE)~ onclick="window.location='preset.htm?led2=1';"/>
</p>
<p>
<INPUT type="button" value="Off" style="width:40px;margin-left:4px;" name="led1" ~ledSelected(0,FALSE)~ onclick="window.location='preset.htm?led1=0';"/>
<INPUT type="button" value="Off" style="width:40px;margin-left:36px;" name="led2" ~ledSelected(1,FALSE)~ onclick="window.location='preset.htm?led2=0';"/>
</p>

</div>
</td>

</table>

</html>

Merci d'avance si vous trouvez une solution pour tout centrer dans la colonne de gauche, comme dans celle de droite.. A bientôt sur le forum :D.

Afficher la suite

A voir également:

Problème création site HTML
Création site web - Guide
Site de telechargement - Accueil - Outils
Site comme coco - Accueil - Réseaux sociaux
Quel site remplace coco - Accueil - Réseaux sociaux
Site x - Guide

7 réponses

Réponse 1 / 7

powerguitou Messages postés 472 Date d'inscription Statut Membre Dernière intervention 29

tu veut centre de cette manière la?

<html>

<table border="3" bordercolor="black" cellpadding="12" align="center">
<tr>
<th align="center" heigth="50">Status Relay</th>
<th align="center" height="50">On Off</th>
</tr>
<tr>
<td height="120" width="195"><div id="content">

<div id="status">
<div id="loading" style="display:none">Error:<br />Connection to relay board was lost.</div>
<div id="display">

<p><br />
<p class="exercise"><b>Relay 1-2</b></p>
<center>
<span style="float:center;height: 10px;font-size:11px;font-weight:bold;margin-left:12px">Lumières <font color="white">- -</font> Climatisation</span>

<p><br />
<span class="leds">
<a id="led0" onclick="newAJAXCommand('leds.cgi?led=0');">*</a>
<a id="led1" onclick="newAJAXCommand('leds.cgi?led=1');">*</a>
</span></p>
</center>

<p><br />
<p><br />
</td>
<td height="120" width="200" align="center"><p class="exercise"><b>Channels 1-2 </b><span style="margin-left:100px;"></span></p>


<div class="examplebox">
<span style="float:center;height: 10px;font-size:11px;font-weight:bold;margin-left:12px">Lumières <font color="white">- -</font> Climatisation</span>

<p>
<INPUT type="button" value="On" style="width:40px;margin-left:4px;" name="led1" ~ledSelected(0,TRUE)~ onclick="window.location='preset.htm?led1=1';"/>
<INPUT type="button" value="On" style="width:40px;margin-left:36px;" name="led2" ~ledSelected(1,TRUE)~ onclick="window.location='preset.htm?led2=1';"/>
</p>
<p>
<INPUT type="button" value="Off" style="width:40px;margin-left:4px;" name="led1" ~ledSelected(0,FALSE)~ onclick="window.location='preset.htm?led1=0';"/>
<INPUT type="button" value="Off" style="width:40px;margin-left:36px;" name="led2" ~ledSelected(1,FALSE)~ onclick="window.location='preset.htm?led2=0';"/>
</p>

</div>
</td>

</table>

</html>

Réponse 2 / 7

Sphax973 Messages postés 3 Date d'inscription Statut Membre Dernière intervention

Oui c'est beaucoup mieux ! Merci beaucoup, je vais regarder les lignes que tu as modifié. Tu pense qu'il serais possible de mettre "lumières et climatisation" au même niveau que celui de droite. Et mettre "Relay 1-2" au même niveau que "Channels 1-2", et de centrer "Relay 1-2" aussi, a peu près comme "Channels 1-2" au dessus de chaque led ?

Réponse 3 / 7

powerguitou Messages postés 472 Date d'inscription Statut Membre Dernière intervention 29

bon je me suis amuser un peu...... peut être un peut trop surtout lol

enfin , il faudra que tu regarde pour les div et ce sera pas mal

<html><center>
<div class='cadre'>
<table border="0px" align="center" height="auto">
	<tr>
		<td style="border: thick groove #DAA520" class="identite" >Status Relay</td>
		<td style="border: thick groove #DAA520"class="identite" >On Off</td>
	</tr>
	
			<div id="status">
			<div id="loading" style="display:none">Error:<br />Connection to relay board was lost.</div>
			<div id="display"> 
	<tr>
		<td style="border-right-color: #000000; border-right-style: groove; border-right-width: thin;Vertical-Align: Text-center" height="100px" width="195px"><p class="exercise"><b>Relay 1-2</b></p></td>
		<td height="100px" width="195px"style="Vertical-Align: Text-center"><p class="exercise"><b>Channels 1-2 </b></p></td>
	</tr>	
	
	<tr>
	<center>
		<td style="border-right-color: #000000; border-right-style: groove; border-right-width: thin;Vertical-Align: Text-center" class="box1">Lumières  Climatisation</td>
		<td class="box1">Lumières  Climatisation</td>
	</center>
	</tr>
	
	<tr>
		<td style="border-right-color: #000000; border-right-style: groove; border-right-width: thin;Vertical-Align: Text-center"class="led" height="120px" width="195px">
			<span class="leds">
				<a id="led0" onclick="newAJAXCommand('leds.cgi?led=0');">*</a>
				<a id="led1" onclick="newAJAXCommand('leds.cgi?led=1');">*</a>
			</span>
			
		</td>
		
		<td height="120px" width="195px"style="Vertical-Align: Text-Top">
			<div class="examplebox">
		<p>
			<INPUT type="button" value="Off" style="width:40px;margin-left:4px;"  name="led1" ~ledSelected(0,FALSE)~ onclick="window.location='preset.htm?led1=0';"/>
			<INPUT type="button" value="Off" style="width:40px;margin-left:36px;" name="led2" ~ledSelected(1,FALSE)~ onclick="window.location='preset.htm?led2=0';"/>
		</p>
		<p>
			<INPUT type="button" value="On" style="width:40px;margin-left:4px;" name="led1" ~ledSelected(0,TRUE)~ onclick="window.location='preset.htm?led1=1';"/>
			<INPUT type="button" value="On" style="width:40px;margin-left:36px;" name="led2" ~ledSelected(1,TRUE)~ onclick="window.location='preset.htm?led2=1';"/>
		</p>
			</div>
		</td>
	</tr></div></div></table></div></center>
	</html>
	
<style>
.cadre{
width:380px;
border-style : solid;
border-width:2 px;
border-color : black;
}
.identite{
text-align:center;
font: bold italic large Palatino, serif;
font-size:30px;
text-shadow:1px 1px 0 #ffff55;
}
.exercise{
border:1px;
text-align:center;
font: bold italic large Palatino, serif;
font-size:25px;
text-shadow:1px 1px 0 #ffffff;
}
.examplebox{
text-align:center;
}
.box1{
font: bold italic large Palatino, serif;
text-align:center;
font-size:16px;
}
.led{
text-align:center;
}
.leds{
font:  serif;
font-size:35px;
}
</style>

Réponse 4 / 7

franckwylliams

Je ne suis pas codeur mais je me sert accessoirement de Bluegriffon qui est un éditeur web assez efficace cela vous dépannera peut -être.
@+

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 7

Sphax973 Messages postés 3 Date d'inscription Statut Membre Dernière intervention

Woaaw merci beaucoup powerguitou !
D'après ce que vous me dites le problème c'est les "div", je vais regarder ça dès que j'ai le temps.
Merci de vos conseil :).

Réponse 6 / 7

powerguitou Messages postés 472 Date d'inscription Statut Membre Dernière intervention 29

Ah tu regardé le dernier code que je t'es envoyer?

Réponse 7 / 7

powerguitou Messages postés 472 Date d'inscription Statut Membre Dernière intervention 29

oui c'est possible,mais ton code est pas propre du tout div qui ne sont pas fermer etc.....

Discussions similaires

C'est quoi le site qui remplace coco chat

Votre réponse

Discussions similaires