Quesqui ne va pas dans mon code ?

Bonjour!

Alors voilà; je suis en pleine customisation du kioske mais je n'arive pas a affiché un deuxième tableau de mon index.
Voilà l'index:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html lang="fr">
<head>
<link rel="stylesheet" href="css/index.css" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Bureau ALX</title>
<script src="js/index.js" type="text/javascript" />
</head>
<body>
<p style="text-align: center;" class="hide">(Cette page utilise les CSS)</p>
<div id="container">


<div id="content" class="clic" cellpadding="0">
<table style="width: 332px; height: 118px">
<tbody>
<tr>
<td style="width: 33%; height: 66%; text-align: center;"><a href="lch/interface/Disque amovible.lch" title="Disque amovible"><img src="img/interface/disque amovible.png" width="48px" height="48px" /></a></td>
<td style="width: 33%; height: 66%; text-align: center;"><a href="lch/interface/Disque Z.lch" title="Disque Z"><img src="img/interface/disque dur.png" width="48px" height="48px" /></a></td>
<td style="width: 33%; height: 66%; text-align: center;"><a href="lch/interface/Data.lch" title="Data"><img src="img/interface/dossier.png" width="48px" height="48px" /></a></td>
</tr>
<tr>
<td style="width: 33%; height: 33%; text-align: center;"><h4>Disque amovible</h4></td>
<td style="width: 33%; height: 33%; text-align: center;"><h4>Disque Z</h4></td>
<td style="width: 33%; height: 33%; text-align: center;"><h4>Documents</h4></td>
</tr>
</tbody>
</table>
</div>



<div id="right" class="clic" cellpadding="0">
<table style="width: 50px; height: 200px">
<tbody>
<tr>
<td style="width: 50px; height: 50px; text-align: center;"><a href="lch/interface/Documents.lch" title="Documents"><img scr="img/interface/Documents s.png" width="48px" height=" 48px"/></a></td>
</tr>
<tr>
<td style="width: 50px; heidht: 50px; text-align: center;"><a href="lch/interface/Lien.lch" title="Lien"><img scr="img/interface/Lien s.png" width="48px" height="48"/></a></td>
</tr>
<tr>
<td style="width: 50px; height: 50px; text-align: center;"><a href="lch/interface/Divers.lch" title="Divers"><img scr="img/interface/Dossier s.png" width="48px" height=" 48px"/></a></td>
</tr>
<tr>
<td style="width: 50px; heidht: 50px; text-align: center;"><a href="lch/interface/Lycée.lch" title="Lycée"><img scr="img/interface/Dossier s.png" width="48px" height="48px"/></a></td>
</tr>
</tbody>
</table>
</div>



<div id="up" class="clic" cellpadding="0">
<table style="width: 464px; height: 66 px">
<tbody>
<tr>
<td style="width: 50px; height: 50px; text-align: center;"><a href="lch/interface/Documents.lch" title="Documents"><img scr="img/interface/Documents s.png" width="48px" height=" 48px"/></a></td>
<td style="width: 50px; heidht: 50px; text-align: center;"><a href="lch/interface/Lien.lch" title="Lien"><img scr="img/interface/Lien s.png" width="48px" height="48"/></a></td>
<td style="width: 50px; height: 50px; text-align: center;"><a href="lch/interface/Divers.lch" title="Divers"><img scr="img/interface/Dossier s.png" width="48px" height=" 48px"/></a></td>
<td style="width: 50px; heidht: 50px; text-align: center;"><a href="lch/interface/Lycée.lch" title="Lycée"><img scr="img/interface/Dossier s.png" width="48px" height="48px"/></a></td>
</tr>
</tbody>
</table>
</div>



</div
</body>
</html>

Et le css:

body {
margin: 0;
color: #000;
font-family: Arial, Verdana, Helvetica, Arial, sans-serif;
background-color: #000000
}

a {
text-decoration: none;
color: #6B6BB5;
}

a:hover {
text-decoration: none;
color: #FE7F01;
}

a:active {
text-decoration: none;
color: #FF9900;
}

h1 {
margin-top: 0.5em;
font-size: 1.2em;
font-family: Arial, Verdana, Helvetica, sans-serif;
text-align: right;
letter-spacing: 1.5pt;
}

h2 {
font-size: 1em;
font-family: Arial, Helvetica, Verdana, Arial, sans-serif;
margin-top: 0.5em;
text-align: left;
letter-spacing: 1.3pt;
margin-bottom: 0px;
line-height: 50%;
}

h2 a, h2 a:visited {
text-decoration: none;
color: #35bdfb;
}

h2 a:hover {
color: #FF9900;
}

h2 a:active {
color: #FF9900;
}

h3 {
font-size: 1.2em;
font-family: Arial, Verdana, Helvetica, Arial, sans-serif;
margin-top: 0.5em;
margin-bottom: 0.0em;
text-align: center;
letter-spacing: 1.5pt;
}

p {
font-size: 0.8em;
text-align: left;
line-height: 1.3em;
}

img {border: 0px none;}

#container {
position: absolute;
width: 500px;
left: 0%;
margin-left: 0px;
height: 318px;
top: 0%;
margin-top: 0px;
background-image: url('../img/interface/v1.5-01.png');
////background-repeat:no-repeat; background-position-y:center
}

#content {
overflow: auto;
position: absolute;
top: 106px;
width: 332px;
height: 118px;
left: 54px;
bottom: 94px;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
font-size: 0.8em;
color: #2eaaeb;
text-align: center;

}

#right {
position: absolute;
top: 104px;
right: 104px;
margin: 0;
width: 50px;
height: 120px;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;

#up {
position: absolute;
top: 5px;
right: 60px;
margin: 0;
width: 464px;
height: 66px;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
}

.hide {
display: none;
color: white
}

.clic a:visited img, .clic a img {
filter: alpha(opacity=100);
opacity:1;
}

.clic a:hover img {
filter: alpha(opacity=50);
opacity:0.5;
}

Le second tableau (right) refuse de s'affiché, je voudrai avoir au final une febêtre de 50*100px avec une barre de défilement verticale.

Merci de m'aider.

Salut

Heuu, le code me parait super confus, et je ne vois pas bien l'intérêt d'utiliser une feuille CSS si on met des tableaux <table> </table> en html !
Le CSS permet justement d'éviter les lourdeurs de code de certaines balises html. A moins que tu modifies un squelette de cms)

Je ne vois pas le class "clic" de définit.

Pour plus d'infos sur une utilisation rationnelle du CSS, il y a des sites comme: Alsacreations; maxdesign, ou alors cssply

PS: tu aurais du fournir le code entier (avec le "head") pour qu'on puisse l'essayer !

A+

[Edit Tolosano] Nettoyage des balises [/edit]

Heuu, le code me parait super confus

Pourquoi ?

je ne vois pas bien l'intérêt d'utiliser une feuille CSS si on met des tableaux <table> </table> en html !

Moi aussi j'ai trouvé ça bizard mais c'est commeça pour chaque tableau avec le kiosk original.

Le CSS permet justement d'éviter les lourdeurs de code de certaines balises html. A moins que tu modifies un squelette de cms)

cms ???

Je ne vois pas le class "clic" de définit.

c'est a dire ?

Pour le head c'est le même que l'original, et mon index se fini après le tableau de droite.
Sinon j'ai une question; aquoi ser alt"***" ?

merci pour tont aide.

Salut

- Pour les "cms": c'est un genre de site tout prêt que tu peux paramétrer à volonté. En général, ils permettent de partager assez facilement des données ou des infos

- à propos de alt"***", je ne connais pas !

- Pour class"clic":
un moment dans ton code html, on trouve: <div id="right" class="clic" cellpadding="0">

Le id="right" renvoit à ta page CSS pour définir les attributs de la balise <div>

Le class="clic" n'apparait nulle part ailleurs. Il devrait aussi définir des attributs à une balise <div>
et se trouver dans la feuille CSS !

D'ailleurs, le problème vient peut être de là, car dans la même balise on trouve à la fois "id" et "class".(je n'ai jamais tenter l'association des 2 d'ailleurs)
Il faudrait supprimer class="clic" pour voir.

- pour le code compliqué, les tableaux le rendent peu lisible. On ne devrait trouver aucun tableau.
Il est possible de créer des tableauX ou des présentations en colonne rien qu'en CSS. (avec l'instruction "float" notemment)
Si tu veux jeter un oeil sur cette page, elle est entièrement gérée par une feuille CSS. Il y a des images du texte et 2 colonnes !
C'est [url=http://x.rambler.free.fr/fs9/fs.htm] ici [/url]

Pour le CSS j'utilise TopStyle3 (il est gratuit mais pas libre, désolé!)

A+

- Pour class"clic":
un moment dans ton code html, on trouve: <div id="right" class="clic" cellpadding="0">

Le id="right" renvoit à ta page CSS pour définir les attributs de la balise <div>

Le class="clic" n'apparait nulle part ailleurs. Il devrait aussi définir des attributs à une balise <div>
et se trouver dans la feuille CSS !

Le class "clic aparait dans le css plus bas (je n'ai pas voulut mettre tout pour ne pas trop charger la page mais je vai éditer ça), la aussi j'ai laisser l'original (html et css).
Le class paramètre les effet des image si j'ai bien compris (ici il réduit l'opacité lorsque l'imange est pointé avec la souris), si je l'enlève il n'y a plus d'effet.

Je n'ai que quelque notion en html et les css je ne connaissait pas avant de commencer la customisation du kiosk, donc je fait ça en m'inspirant de l'original.

Je n'ai que quelque notion en html et les css je ne connaissait pas avant de commencer la customisation du kiosk, donc je fait ça en m'inspirant de l'original.

Salut,

pour mieux comprendre tout ca (c'est vraiment pas sorcier) , je te conseille fortement de lire les cours sur alsacreations et openweb. Ce sont 2 solides communautés qui s'agitent sur le xhtml et les css.

bon courage, et bon apprentissage.

opi

edit : rajout du "s" a alsacreationS .. put*** c'est raphael qui va pas etre content !!

Se connecter

Quesqui ne va pas dans mon code ?

Qui est en ligne ?