aide pour la mise en forme XHTML/CSS !

**italiasky** · 05/01/2008, 18h01

Bonjour,

J'aurais besoin d'aide pour découper mon site en le rendant valide xhtml/css.

Comment le découperiez-vous ?
Y a-t-il des méthodes de bases sur lesquelles partir en fonction des types de design ?
Faut-il des containers ?

Voici ce que je ferais déja en xhtml :
Est-ce que je pars bien ou pas ?

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
 
<body>
<img id="badge" src="images/ruban.png" alt="" width="127" height="129" />
 
<div id="container">
 
  	<div id="header">
 
                <img id="logo" src="images/logo.jpg" width="153" height="76" alt="" />
		<img id="slogan" src="images/slogan.jpg" width="241" height="44" alt="" />
  		<ul id="menu">
		  	<li id="presentation" class="presentation_active"><a href="#"></a></li>			
			<li id="inscription" class="inscription_noactive"><a href="#"></a></li>
                        <li id="espace_membre" class="espace_membre_noactive"><a href="#"></a></li>
		</ul>
        </div>
 
</div>
</body>

Voici le design

Alors déja pour le badge (le ruban) en haut a gauche, j'ai mis ca :
C'est un png transparent, donc sous IE6 il ne faut pas qu'il se mette.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
#badge
{
	display: block;
	visibility: visible !important;
	visibility: hidden;
	position: absolute;
	top: 0px;
	left: 0px;
}

Merci de votre aide
++

**Kerod** · 05/01/2008, 20h32

Pas facile d'avoir une idée sans code

Mais bon je dirais que c'est peut-être un problème de positionnement

Le ruban devrait être en absolute par exemple et il faudrait savoir comment est organisé le reste.

**italiasky** · 06/01/2008, 11h39

J'ai changé le titre de mon post, je vais repartir du début je crois bien

Merci

**Kerod** · 06/01/2008, 15h57

Pourquoi ne pas découpé en fonction des éléments important ?

Fond header, bouton, footer, etc ? le corps c'est de blanc donc pas besoin de grand chose

**italiasky** · 06/01/2008, 17h09

Oui mais en fait j'ai du mal a obtenir ce que je veux...

Vous partirez comment sur la découpe ?

Moi, j'essaye comme ca :

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
28
29
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Titre</title>
<link href="images/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
 
	<div id="header">
 
    	<div id="header-inner">
 
            <h1><a href="..."><img src="images/logo.jpg" width="153" height="76" alt="" /></a></h1>
			<p id="slogan"><img src="images/slogan.jpg" width="241" height="44" alt="" /></p>
 
    	</div> <!-- #header-inner -->
 
        <p id="badge"><a href="..."><img id="badge" src="images/badge.png"  width="127" height="129" alt="" /></a></p>
 
	</div> <!-- #header -->
 
	<div id="main">
 
	</div><!-- #main -->
 
</body>
</html>

aide pour la mise en forme XHTML/CSS !

CSS

Discussions similaires

Partager

Partager