28220 sujets

CSS et mise en forme, CSS3

bonjour j'ai besoin de vous!
enn efffet j'ai un petit probleme!

http://jeremie.pottier.free.fr

quand vous allez dans n'importe quel page vous pouvez constater que le design est bien collé au haut du navigateur mais je voudrai qu'il en soit de meme pour le bas, qu'il soit collé au navigateur (ce qui n'est aps le cas!) pour le haut j'ai juste mi dans le body et head margin-top : 0px; ... sa suffit mais pour le bas un margin-bottom : 0px ne marche pas!

donc je vous poste le code!

XHTML..............................................................
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0236)http://65.54.184.250/cgi-bin/getmsg/index2.html?curmbox=F000000001&a=8bd35264eb91dd53b9d2bae020328234&msg=MSG1107386636.29&start=4128736&len=8265&mimepart=5&disk=65.54.184.66_d929&login=jeje59350&domain=hotmail%2ecom&_lang=FR&country=FR -->
<HTML xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Creas 2d</TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1"><LINK 
title=Design media=screen href="mepcrea_mozilla.css" type=text/css rel=stylesheet>
<META content="MSHTML 6.00.2900.2523" name=GENERATOR></HEAD>
<BODY>
<div class=bloc_fond>
<DIV class=bloc>
<div class=bloc1>
<div class=image>
<br><img src="logo.jpg"><a href="index2.htm"><img src="qui_suije.jpg"border=0></a><a href="mailto:jeje59350@hotmail.com"><img src="contact.jpg"border=0></a><a href="projets.html"><img src="projets.jpg"border=0></a><a href="crea.html"><img src="creas_2d.jpg"border=0></a><a href="crea_3d.html"><img src="creas_3d.jpg"border=0></a><a href="http://jeremie.pottier.free.fr"><img src="accueil.jpg"border=0></a>
<DIV class=texte>


<br><br><br><b>CREAS 2D :</b> Je vous présente ici mes quelques création de la catégorie 2d (webdesigns, wallpapers...)


<br><br><br>

<div class=cadre_img>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">

    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP"> Réalisation pas très extraordinaire, c'est un petit coup de gueule contre tf1. J'aime quand même assez le rendu. 
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/tf1.jpg"><img src="tf1.jpg" width="132px" height="106px" border=0 ></a></TD>
    </TR>
</TABLE>
<br><br>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">

    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP"> Voici ici certainement ma plus belle réalisation sous photoshop. C'est une image coca-cola entièrement faite sous photoshop. j'ai dû pour pouvoir créer ce dessin, rechercher des techniques de dessins, des effets nouveaux... 
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/coca.jpg"><img src="coca.jpg" width="132px" height="106px" border=0 ></a></TD>
    </TR>
</TABLE>

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">
<br><br>
    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP"> ICI, mon premier design, sur le theme de "nintendo". Je ne me suis occupé ici que du design et pas de la mise en page.
	  <br>Il est visitable à l'adresse suivant : <a href="http://site.gamesofnintendo.com/">site.gamesofnintendo.com</a>
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/nintendo.jpg"><img src="nintendo.jpg" width="132px" height="106px" border=0 ></a></TD>
    </TR>
</TABLE>
<br><br>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">

    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP"> Banniere créée pour la premiere version de mon portfolio ou j'experimente les effets de reflets, goutte d'eau, et style plastique.
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/banniere.jpg"><img src="banniere.jpg" width="132px" height="106px"border=0 ></a></TD>
    </TR>
</TABLE>

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">
<br><br>
    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP">Une maquette d'un site de location de serveurs actuellement en dévellopement.
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/66.jpg"><img src="66.jpg" width="132px" height="106px" border=0></a></TD>
    </TR>
</TABLE>

<br><br>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">

    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP"> Voila un wallpaper fortement inspiré d'un autre wallpaper pour lequel j'ai essayé plusieurs techniques pour dessiner les nuages, les reflets métalliques, le fond violet...
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/texas.jpg"><img src="texas.jpg" width="132px" height="106px" border=0></a></TD>
    </TR>
</TABLE>

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">
<br><br>
    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP">Une maquette fort sobre d'un design pour le lycée jean perrin à Lambersart.<br>Site à l'adresse suivante : <a href="http://jeanperrin59.free.fr/admin/index.php">http://jeanperrin59.free.fr/admin/index.php</a>
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/screen.jpg"><img src="screen.jpg" width="132px" height="106px" border=0></a></TD>
    </TR>
</TABLE>

<br><br>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">

    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP"> Maquette pour un site counter strike, un des premiers designs à voir le jour.
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/maquette.jpg"><img src="maquette.1.jpg" width="132px" height="106px" border=0></a></TD>
    </TR>
</TABLE>

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">
<br><br>
    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP">dessin format a4 pour un travail demandé au college, il a son style bien particulier...
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/racisme.jpg"><img src="racisme.1.jpg" width="132px" height="106px" border=0></a></TD>
    </TR>
</TABLE>
<br><br>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">

    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP"> Maquette de site juste pour tester de nouveaux effets sur les reflets, il reste très sobre.
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/cirmad.jpg"><img src="cirmad1.jpg" width="132px" height="106px"border=0 ></a></TD>
    </TR>
</TABLE>

<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">
<br><br>
    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP">Une petite page d'introduction à un cyber éxposé sur les réseaux informatiques, je trouve le rendu pas mauvais.
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/reseau1.jpg"><img src="reseau1.1.jpg" width="132px" height="106px"border=0 ></a></TD>
    </TR>
</TABLE>


<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 RULES="NONE" FRAME="VOID">
<br><br>
    <TR>
      <TD HEIGHT=150 WIDTH=300 BGCOLOR="#808080" ALIGN="LEFT" VALIGN="TOP">J'ai cherché ici le réalisme en essayant de dessiner un arbre mort surmonté d'une cabane.Je n'ai jamais fini ce dessin, faute de temps.
	  </TD>
      <TD WIDTH=150 HEIGHT=150 BGCOLOR="#C0C0C0" ALIGN="center" VALIGN="center"><a href="http://jeremie.pottier.free.fr/site/arbre5.1.jpg"><img src="arbre.1.jpg" width="132px" height="106px"border=0 ></a></TD>
    </TR>
</TABLE>
<br>




</DIV></DIV></div></div></div></div><BR><BR><BR><BR></BODY></HTML>



CSS................................................................................;

body
{
   width: 800px;
   margin: auto;
   margin-top: 0px;
   margin-bottom: 0px;    
   background-color: #AFAFAF;

}
head
{
   margin-bottom: 0px;  
   margin-top: 0px;


}

.bloc_fond
{

	background-color: #EAEAEA ;
}



.bloc1
{
	background: url("bordure_gauche.jpg") left repeat-y;
}





.bloc
{
	background: url("bordure_droite.jpg") right repeat-y;
}




.image
{

	width: 700px;
	margin : auto;

}


.texte
{
	
	
	padding: 0 40px;
	text-align: left;
	color: #6CB13C;
	font-size:11px;
	font-family:arial;
	margin-right: 30px;
}


.cadre_img
{

	width : 450px ;
	text-align: left;
	color: #FFFFFF;
	margin: auto;



}
Bonsoir,

Avec 4/5 en HTML et XHTML tu fais encore beaucoup de faute. Concentre toi sur ta page d'accueil. Smiley eek

- <br />
- des "" pour les class
- img src="contact.jpg"border=0 tout collé ?!?

Ensuite revois ton process, tu par mal. tu met un height pour ton bloc texte alors que c'est normalemtn le texte qui pousse et impose son height.

Met tout à plat, part d'un modèle déja fait et hop !
Bonjour,

a écrit :
quand vous allez dans n'importe quel page vous pouvez constater que le design est bien collé au haut du navigateur mais je voudrai qu'il en soit de meme pour le bas, qu'il soit collé au navigateur (ce qui n'est aps le cas!)

Avoir un contenu suffisament important pour occuper en général tout l'écran ?
Sinon et bien que cela n'est pas beaucoup de sens avec une consultation écran (media=screen) on peut tricher et donner l'illusion que..., avec une image de fonds qui se répète dans la hauteur.
nan, meme si je rajoute du texte il mettra toujours la meme marge entre les bas du design et le bas du navigateur et bon pour les fautes de syntaxes dans mon xhtml je le modifies mais sa ne change en rien mon probleme!!

et pout le "height" je doi bigler mais je n'en voi un nulle part lool!
(au moin dans le code que j'ai posté ici), pour le code de ma page index en effet j'ai mit un height parce que si je n'en met pas un le design colle le texte et sa fait tres moche coté design!!

donc... sa ne m'aide pas trop... Smiley bawling il doit bien y avoir un truc...
Administrateur
C'est bien une question de mise en page ?

OK, donc je déplace en salon "CSS et mise en page"

Ensuite, j'avoue qu'avec un code pareil, difficile de trouver une solution.

A tout hasard, je propose la solution du Reset universel :
* {margin: 0; padding: 0;}


Sinon, fais un tour sur ce billet Smiley smile
Modifié par Raphael (09 Mar 2005 - 19:37)