Codage

kymer_officiel Messages postés 38 Date d'inscription   Statut Membre Dernière intervention   -  
kymer_officiel Messages postés 38 Date d'inscription   Statut Membre Dernière intervention   -
bonsoir,
j'ai un problème avec mon code.
je suis entrain de crée un site web, c'est un devoir, et j'ai rencontrer un problème.
j'ai insérer dans toutes mes pages un sommaire en menue burger, et dans une de mes page il y a le jeu "morpion" et il est coller a mon menu, et je n'arrive pas a le défaire. pourriez-vous m'aider s'il vous plait.

cordialement kymer

4 réponses

Réponse 1 / 4
Xileh Messages postés 19424 Date d'inscription   Statut Modérateur Dernière intervention   6 466
 
Bonjour

https://www.commentcamarche.net/infos/25899-demander-de-l-aide-pour-vos-exercices-sur-ccm/


0
Réponse 2 / 4
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
Bonjour,

Donc tu veux espacer ton morpion du menu ?
As tu essayé de mettre du MARGIN ou du PADDING ?
Ce sont des propriétés CSS qui te permettront de positionner tes éléments.

Quoi qu'il en soit, sans voir ton code.. IMPOSSIBLE pour nous de t'aider d'avantage.

NB: Pour poster ton code sur le forum, tu devras utiliser les BALISES DE CODE.
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

.

0
Réponse 3 / 4
kymer_officiel Messages postés 38 Date d'inscription   Statut Membre Dernière intervention  
 
Oui excuse moi : 

#blue{
  background: #141419;
  color: #141419;
  font-family: 'Ubuntu';
  margin-left: auto;
}
#game_map{
  border: 1px solid #FFFFFF;
  clear: both;
  float: left;
  position: absolute;
  left: 40%;
  top: 30%;
  margin-bottom: 150px;
}
#game_map .cell{
  cursor: pointer;
  float: left;
  border: 1px solid #FFFFFF;
  width: 100px;
  height: 100px;
  line-height: 100px;
  font-size: 32px;
  text-align: center;
} 
.clear{
  clear: both;
  line-height: 0px;
}
#game_map .player1_cell{
  color: #FFFFFF;
}
#game_map .player2_cell{
  color: #FFFFFF;
}
#game_map .hover{
  background: #FFFFFF;
}
#game_map .win{
  background:#FFFFFF;
}
#player_mark, #player_name{
  padding: 0px 3px;
}
.end_game{
  display: none;
}
#winner_name{
  color: #17BF63;
}
h1
{
  position: absolute;
  color: #FFFFFF;
  left: 43%;
  top: 2%;
}
h2
{
  position: absolute;
  color: #FFFFFF;
  left: 42%;
  top: 15%;

}

table {

  position: absolute;
  color: #FFFFFF;
  left: 5%;
  top: 10%;
  border: 1px dashed #141419;
  width: 20%;
  height: 10%;
  font-size: 18px;
}

th,td 
{
text-align: center;
}

h3
{
  position: absolute;
  color: #FFFFFF;
  top: 2%;
  left: 8%;
  font-size: 22px;
}
td{
  color: #17BF63;
}

#winner
{
  position: absolute;
  left: 33%;
  top: 41%;
  font-size: 42px;
  background: #dedede;
  border: 1px dashed #17BF63;
  padding: 10px;


}


#ask_restart
{
  position: absolute;
  left: 45%;
  top: 84%;
  text-decoration: none;
  font-size: 32px;
  color: green;
  font-weight: bold;
}


 @media (min-width: 1280px) {
  #game_map{
    position: absolute;
  left: 34%;
  top: 25%;
  }
  #ask_restart{
    position: absolute;
    left: 45%;
    top: 91%;
  }

 }
 a
 {
  text-decoration: none;
  color:#A7D47D;
  font-weight: bold;
 }






 

.sf-arrows .sf-with-ul:after {
  content: "\f107";
  position: absolute;
  right: 15px;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
}

.sf-arrows ul .sf-with-ul:after {
  content: "\f105";
}

/* Nav Meu Container */
#nav-menu-container {
  float: right;
  margin: 0;
}

@media (max-width: 768px) {
  #nav-menu-container {
    display: none;
  }
}

/* Nav Meu Styling */
.nav-menu a {
  padding: 0 8px 10px 8px;
  text-decoration: none;
  display: inline-block;
  color: #fff;
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  outline: none;
}

.nav-menu > li {
  margin-left: 10px;
}

.nav-menu ul {
  margin: 4px 0 0 0;
  padding: 10px;
  box-shadow: 0px 0px 30px ;
 
  background: #fff;
}

.nav-menu ul li {
  transition: 0.3s;
}

.nav-menu ul li a {
  padding: 10px;
  color: #333;
  transition: 0.3s;
  display: block;
  font-size: 13px;
  text-transform: none;
}

.nav-menu ul li:hover > a {
  color: #17BF63;
}

.nav-menu ul ul {
  margin: 0;
}

/* Mobile Nav Toggle */
#mobile-nav-toggle {
  position: fixed;
  right: 0;
  top: 0;
  z-index: 999;
  margin: 20px 20px 0 0;
  border: 0;
  background: none;
  font-size: 24px;
  display: none;
  transition: all 0.4s;
  outline: none;
  cursor: pointer;
}





#wrap {
  font-family: sans-serif;
  font-size: 21px;
  line-height: 1.6;
  margin: 0;
  display: flex;
  color: #f00;
  transition: transform .4s cubic-bezier(.25, .1, .25, 1);
}

#wrap{
  transform: translate3d(-335px, 0, 0);
}


label {
  height: 0px;
  text-align: right;
  display: block;
  margin-right: -30px;
}


a,
label {
  color: white;
  text-decoration: none;
  display: block;
}

.header {
  background: #f00;
  width: 360px;
  padding: 0 20px;
  display:inline-block;
  vertical-align:top;
}

.nav {
  padding: 25px;
}

.main {
  padding: 25px;
  flex: 1;
  display:inline-block;
}

p {
  max-width: 590px;
  color:#306;
}

#menu{
  display:none;
}
#menu:checked ~ #wrap{
  transform: translate3d(0, 0, 0);
}

label>span{
  display:none;
}
#menu:checked ~ #wrap label>span{
  display:block;
  font-size:48px;
  line-height:48px;
}

#menu:checked ~ #wrap label>svg{
  display:none;
  
  #searchbar     {position:relative; width:1040px; height:auto;}
.formulaire                     {display:inline-block;}
.formulaire .champ           {width:600px; height:35px;}
.formulaire .bouton           { background-image: url(images/searchbar_button.png);background-repeat: no-repeat;width: 35px;height: 35px;padding: 0; }



<!DOCTYPE html>
<html>
<head>
	<title>Jeu du morpion</title>
	<meta charset="utf-8" />
	<link rel="stylesheet" href="stylemorpion.css" type="text/css" />
	<link href='https://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'>
</head>
<body id="blue">
	<input type="checkbox" id="menu" name="menu">
	<div id="wrap">
	  <header class="header">
		<nav class="nav">
		  <label for="menu">
			<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="34px" height="27px" viewBox="0 0 34 27" enable-background="new 0 0 34 27" xml:space="preserve">
	<rect fill="#FFFFFF" width="34" height="4"/>
	<rect y="11" fill="#FFFFFF" width="34" height="4"/>
	<rect y="23" fill="#FFFFFF" width="34" height="4"/>
	</svg>
			<span>×</span>
		  
		  </label>
	  
		  <h1><a href="#">Ciné fou</a></h1>
		  <a href="#"><a href="">L'accueille</a></a>
		  <a href="#">Les Films</a>
		  <a href="#">les Jeux</a>
		  <a href="#">L'agenda</a>
		  
		  <div id="searchbar">
					<form action="" class="formulaire">
					 <input class="champ" type="text" value="Search...)"/>
						<input class="bouton" type="button" value=" " />
					   
					</form>
					</div>
		  
		</nav>
	  </header>
	  <main class="main">

</body>
<body>
	<h1>Jeu du morpion</h1>

	<div id="game_map">
	</div>
	<h3>Parties gagnées</h3>
	<table>
		<tr>
			<th></th>
			<th>Joueur X</th>
			<th>Joueur O </th>
		</tr>
		<tr>
			<th></th>
			<td id="player1_wins">0</td>
			<td id="player2_wins">0</td>
		</tr>
	<h3 id="winner" class="end_game">
		 le gagnant est: <span id="winner_name"></span>
	</h3>
	<div id="ask_restart" class="end_game">
		 <a href="#" id="restart_game">Recommencer</a>
	</div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <!--please open in a 1280x800 res at least-->
 
 <script  src="morpion.js"></script>
</body>
</html>


Voila mon code, je ne n'est pas mis le js, je ne jugez pas utile de le mettre
En tout cas mercis de m'aider
Cordialement kymer
0
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
Déjà, sans regarder le reste... 
</body>
<body>

Non.. ça ce n'est pas possible !
Tu ne dois avoir qu'UN SEUL body dans ta page

Ensuite il semble que tu aies un certain nombre de balises html non fermées...
Ou se trouve le 
</table>
?
Ou se trouve la balise de fin de ta balise 
<main class="main">
0
Réponse 4 / 4
kymer_officiel Messages postés 38 Date d'inscription   Statut Membre Dernière intervention  
 
Ha.......
J'avais mis deux "body" afin de pouvoir mieux mi retrouver, mais si vous dites que cela ne vas pas je vais le modifier de suite.
La balise "table", je ne savais pas qu'il manquer cette partie, c'est un ami qui me la transmit.
Enfin, pour le "main", on ami m'avait dit qu'il n'y avait pas besoin de mettre la fin.

Je vais donc faire de se pas les modification nécessaires et voir si cela a régler mon problème, je vous recontacte si nécessaire

Cordialement kymer
0

Discussions similaires

controleur de codage/décodage PCI
dtp33950 -
kaneagle -

6 réponses
Pilote controleur de codage/décodage PCI manquant
benaquista -
BOUA -

9 réponses
Contrôleur de codage/décodage PCI pilote manquant ASUS X751S
benotiti -
kaneagle -

2 réponses
Problème pilote codage decodage pci
Steph -
Duno59 -

6 réponses
Codage de texte
beauté numerique -
beauté numerique -

8 réponses