on peut faire pour la partie STYLE
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 30 31 32 33
| #contentWrapper{
position:relative;
top:30px;
/* left:50px;/* OUT */
min-width:1200px; /* AJOUT = 200 +800 +200 */
}
#leftSidebar {
/* position:fixed;/* OUT */
width:200px;
float:left; /* AJOUT */
}
#rightSidebar {
/* position:fixed;/* OUT */
float:left; /* AJOUT */
width:200px;
/* right: 100px;/* OUT */
top:60px;
}
#mainContent {
/* position:fixed;/* OUT */
float:left; /* AJOUT */
width:800px;
/* left: 250px;/* OUT */
top:60px;
overflow-x : auto; /* AJOUT */
}
/* pour les IMAGES */
#maincontent div {
width : 1760px; /* nb image * 440px */
}
#maincontent img {
width :440px;
} |
avec comme html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
| <div id="contentWrapper">
<div id="leftSidebar" class="medium">
<font class="bodyTitle">OPB Photography</font>
<p>
<br>PORTFOLIO
<br><font size="-2">//////////////////////////////////</font>
<br><A HREF="Home.php?page=1">Sortie dominicale</A><br><A HREF="Home.php?page=2">My blue nights</A><br><A HREF="Home.php?page=3">La troisième, ter </A>
<br>About
<br>Contact
</div>
<div id="mainContent">
<div>
<img src="collection/Serie1/img1.jpg" alt="The road on" /><img src="collection/Serie1/img386.jpg" alt="clownesque" /><img src="collection/Serie1/img388.jpg" alt="doggy" /><img src="collection/Serie1/img410.jpg" alt="mint" />
</div>
</div>
<div id="rightSidebar">
Some comment here, Lorem ipsum dolor. Bla bla bla, je suis dans mon couloir droit et je n'en bougerai pas!!!!
</div>
</div> |
pour détail
<font class="bodyTitle">OPB Photography</font>
ça c'est pas top....
Partager