Tableau avec un fond de deux couleurs

**sourivore** · 13/01/2007, 10h56

Bonjour à tous,

J'aurais voulu savoir si l'un de vous à la solution au problème suivant:
J'aimerais faire une cellule d'un tableau qui a un fond composé de deux couleurs.
C'est à dire la moitié est disons Noire et l'autre rouge.

Quelqu'un saurait-il comment effectuer celà?

PS : Le contenu de la cellule doit être à moitié sur le rouge et à moitié sur le noir donc la solution ne consiste pas à faire un tableau de deux cases dans la cellule.

Le rendu que je voudrais avoir serait donc le suivant :

**Bisûnûrs** · 13/01/2007, 11h06

Impossible sans passer par une image.

**sourivore** · 13/01/2007, 18h40

Tu ne sais pas comment faire alors?

Je suis parti sur une idée mais je bloque sur un truc:
J'aimerais faire un tableau qui prenne toute la page.
Or quand je met le tableau à 100% il me prend que la taille de la fenêtre même si la page en elle-même est plus grande (il y a donc des ascenceurs)

Y a t il un moyen de vraiment prendre 100% de la page et non 100% de la fenêtre?

Merci.

Je vous ferai part de ma solution si celle-ci fonctionne ^^

**sourivore** · 13/01/2007, 19h49

Et pourtant j'ai mis mon table ainsi que body et html avec height=100% :

Pour aider voici le lien:
[EDIT]

En déroulant les liens des News (flèches) ou en rapetissant la fenêtre on voit directement le bug (barre blanche en bas)

**sourivore** · 14/01/2007, 12h21

Pour aider j'ajoute ce morceau de code simplifié où on constate le même problème :

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
<html height="100%">
	<head>
		<style>
.tableauGeneral {
  position: absolute;
  top: 0px;
}
                </style>
	</head>
	<body height="100%">
		<table width="100%" height="100%">
			<tr height="100%">
				<td width="10%" height="100%" bgcolor="red">
				</td>
				<td width="90%" height="100%" bgcolor="green">
				</td>
			</tr>
		</table>
		<table class="tableauGeneral">
			<tr>
				<td>
					a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>
				</td>
			</tr>
		</table>
	</body>
</html>

Si vous arrivez à trouver la réponse je vous en serai très reconnaissant car là je me retrouve assez coincé

**fallais** · 14/01/2007, 13h05

Et en utilisant 2 div et le CSS ?

**sourivore** · 14/01/2007, 14h11

En CSS ou en attribut le résultat est le même

**Candygirl** · 14/01/2007, 19h48

Peut-être quelque chose du genre en jouant avec le relatif ?

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
<!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=iso-8859-1" />
<title>Document sans nom</title>
<style type="text/css">
<!--
* {margin:0;padding:0;}
html,body {height:100%;}
body {background-color:#6DA4E3;}
#main  {min-height:100%; background-color:#4C94A0; position:relative;left:-90%;}
* html #main {height:100%;} /* hack ie 6- */
 
#contenu {position:relative; left:90%;}
 
-->
</style>
</head>
 
<body>
<div id="main">
	<div id="contenu">contenu du site</div>
</div>
</body>
</html>

**sourivore** · 14/01/2007, 21h36

Et bien oui impeccable ça marche ^^.
J'ai pas vraiment compris la totalité du code donc je vais me pencher un peu dessus mais en tout cas ça marche.

Merci beaucoup!

PS : Tu vois Bisûnûrs il ne faut jamais dire jamais.

**zyongh** · 15/01/2007, 00h54

Malheureusement il n'y a pas beaucoup de femmes dans l'informatique.

J'ai au moins le plaisir de voir qu'il y en a au moins de qualité..

Bravo pour ta solution, j'ai testé et ça fonctionne super même si je n'en n'ai aucune utilité.

Tableau avec un fond de deux couleurs

HTML

Discussions similaires

Partager

Partager