28172 sujets

CSS et mise en forme, CSS3

Tout d'abord bonjour !
c'est mon premier message ici ! (ça ce fête lol)

voila je voudrais faire une mise en page full screen comme le lien suivant

http://markmail.org/search/?q=kevin+waterson#query:kevin%20waterson+page:1+mid:iythga2nnygkq4zd+state:results
son site n'a pas de scroll vertical et ni horizontal et quand on appuie
sur F11 les frames s'agrandissent aussi du coup tout tien toujours bien dans l'ecran !

j'ai essayé de faire la même mise en page mais je n'y arrive pas !

je ne sais pas si je m'y suis bien pris mais pour que vous puissiez regarder je vous donne mon code:


@CHARSET "UTF-8";

* {
	margin: 0 0;
	padding: 0 0;
}

html,body
{
	min-width: 1000px;
	min-height: 500px;
	height: 100%;
	background: #666;
	max-height: 100%;
	max-width: 100%;
	color: #cccccc;
	font: 0.9em Arial,Verdana,sans-serif; 
}

#header
{
	height: 9%;
	background: #666666;
}

#menu
{
	padding: 0.4%;
	background: #333;
	padding-left: 5px;
	border-bottom: 1px solid #000;
}

#container
{
	height: 84%;
}

#footer
{
	padding: 0.2%;
	clear: both;
	background: #666;
	border-top: 1px solid #000000;
	font: 8pt Arial;
	line-height: 200%;
}

#panel
{
	float: left;
	width: 30%;
	height: 100%;
	background: #444;
	border-right: 1px solid #000;
	min-width: 300px;
	min-height: 350px
	overflow: hidden;
}

#panelContent
{
	overflow: auto;
	margin: 1% 1.8% 0 1.8%;
	background: #333;
	height: 85%;
	padding: 10px;
	border: 1px solid #000;
}

#paginator
{
	text-align: center;
	padding: 8px 0 8px 0;
}

#rightPanel
{
	
	height: 100%;
	background: #222;
	overflow: hidden;
}

#marginHelper
{
	padding: 0.5% 0.9%;
	background: trensparent;
	height: 100%;
}

#nameCustomer
{
	font-size: 1.5em;
	padding: 0.5% 0.5% 0.5% 1.5%;
}

#infoCustomer
{
	border: 1px solid #000;
	background: #333;
	padding: 10px;
}

#fileContent
{
	position: relative;
	height: 69%;
	margin-top: 0.5%;
	background: #333;
	padding: 14px;
	border: 1px solid #000;
	overflow: auto;
}


quand j'appuie sur F11 les frames ne suivent pas

upload/19066-frameset.jpg
Modifié par polymorph (28 Jan 2009 - 21:42)
Bonjour,

polymorph a écrit :
son site n'a pas de scroll vertical et ni horizontal et quand on appuie
sur F11 les frames s'agrandissent aussi du coup tout tien toujours bien dans l'ecran !

j'ai essayé de faire la même mise en page mais je n'y arrive pas !

Il faut ça avec beaucoup de JavaScript pour détecter les dimensions du viewport (zone de visualisation du navigateur), et adapter les dimensions des blocs, voire leurs contenus.

En CSS seul, on peut dans une certaine mesure utiliser le positionnement absolu en utilisant à la fois top et bottom (non supporté par IE6). Ça ouvre quelques possibilités, mais ça reste limité.
Modifié par Florent V. (28 Jan 2009 - 22:22)