28172 sujets

CSS et mise en forme, CSS3

Bonjour,

j'ai mis dans ma page index un include comme ceci :

<? include 'demo.php'?>
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="utf-8">
<link href="css/reset.css" rel="stylesheet" type="text/css" />
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery.faded.js"></script>


le problème c'est que ma page demo.php prend le css de ma page index.php comment procéder pour que ma page demo.php garde son css?

merci
Modifié par jessjc (23 Aug 2011 - 15:18)
Ben si on sait pas ce qu'il y a dans demo.php, ça va pas aider.

Deuxièmement, tu ne devrais pas mettre ton include après la déclaration du head etc ?
Dans demo.php, j'ai du code php + ça :


<!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=utf-8" />
<title></title>
    
    <link rel="stylesheet" type="text/css" href="login_panel/css/style2.css" />
    <link rel="stylesheet" type="text/css" href="login_panel/css/slide.css" />
    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    
    <!-- PNG FIX for IE6 -->
    <!--  http://24ways.org/2007/supersleight-transparent-png-in-ie6  -->
    <!--[if lte IE 6]>
        <script type="text/javascript" src="login_panel/js/pngfix/supersleight-min.js"></script>
    <![endif]-->
    
    <script src="login_panel/js/slide.js" type="text/javascript"></script>
    
    <?php echo $script; ?>
</head>

<body>

<!-- Panel -->
<div id="toppanel">
	<div id="panel">
		<div class="content clearfix">
			<div class="left">
				<hh1>Bienvenue</hh1><br>
				<hh2>Vous etes nouveau?</hh2>		
				<p class="grey">allez dans la section membre</p>
				<br>
				<hh2>Forum</hh2>
				<p class="grey">J'y <a href="http://.." title="Download">go</a></p>
			</div>
            
            
            <?php
			
			if(!$_SESSION['id']):
			
			?>
            
			<div class="left">
				<!-- Login Form -->
				<form class="clearfix" action="" method="post">
					<hh1>Login</hh1>
                    
                    <?php
						
						if($_SESSION['msg']['login-err'])
						{
							echo '<div class="err">'.$_SESSION['msg']['login-err'].'</div>';
							unset($_SESSION['msg']['login-err']);
						}
					?>
					
					<label class="grey" for="username">Username:</label>
					<input class="field" type="text" name="username" id="username" value="" size="23" />
					<label class="grey" for="password">Password:</label>
					<input class="field" type="password" name="password" id="password" size="23" />
	            	<label><input name="rememberMe" id="rememberMe" type="checkbox" checked="checked" value="1" /> &nbsp;Remember me</label>
        			<div class="clear"></div>
					<input type="submit" name="submit" value="Login" class="bt_login" />
				</form>
			</div>
			<div class="left right">			
				<!-- Register Form -->
				<form action="" method="post">
					<hh1>Not a member yet? Sign Up!</hh1>		
                    
                    <?php
						
						if($_SESSION['msg']['reg-err'])
						{
							echo '<div class="err">'.$_SESSION['msg']['reg-err'].'</div>';
							unset($_SESSION['msg']['reg-err']);
						}
						
						if($_SESSION['msg']['reg-success'])
						{
							echo '<div class="success">'.$_SESSION['msg']['reg-success'].'</div>';
							unset($_SESSION['msg']['reg-success']);
						}
					?>
                    		
					<label class="grey" for="username">Username:</label>
					<input class="field" type="text" name="username" id="username" value="" size="23" />
					<label class="grey" for="email">Email:</label>
					<input class="field" type="text" name="email" id="email" size="23" />
					<label>A password will be e-mailed to you.</label>
					<input type="submit" name="submit" value="Register" class="bt_register" />
				</form>
			</div>
			
            
            <?php
			
			else:
			
			?>
            
            <div class="left">
            
            <hh2>Members panel</hh2>
            
            <p>You can put member-only data here</p>
            <a href="registered.php">View a special member page</a>
            <p>- or -</p>
            <a href="?logoff">Log off</a>
            
            </div>
            
            <div class="left right">
            </div>
            
            <?php
			endif;
			?>
		</div>
	</div> <!-- /login -->	

    <!-- The tab on top -->	
	<div class="tab">
		<ul class="login">
	    	<li class="left">&nbsp;</li>
	        <li>Hello <?php echo $_SESSION['usr'] ? $_SESSION['usr'] : 'Guest';?>!</li>
			<li class="sep">|</li>
			<li id="toggle">
				<a id="open" class="open" href="#"><?php echo $_SESSION['id']?'Open Panel':'Log In | Register';?></a>
				<a id="close" style="display: none;" class="close" href="#">Close Panel</a>			
			</li>
	    	<li class="right">&nbsp;</li>
		</ul> 
	</div> <!-- / top -->
	
</div> <!--panel -->



</body>
</html>


bonsoir,

Si je comprends bien, il y a un premier problème qui est que tu veux placer deux "header" dans une même page.
Le deuxième étant que tu aurais peut être les même dénominations de class dans les différentes feuilles, non? ce qui interfère forcément...
le css de demo.php


/*
Name: Sliding Login Panel

*/ 

/***** clearfix *****/
.clear2 {clear: both;height: 0;line-height: 0;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.clearfix {height: 1%;}
.clearfix {display: block;}

/* Panel Tab/button */
.tab {
  	background: url(../images/tab_b.png) repeat-x 0 0;
	height: 42px;
	position: relative;
    top: 0;
    z-index: 999;
}

.tab ul.login {
	display: block;
	position: relative;
  	float: right;
  	clear: right;
  	height: 42px;
	width: auto;
  	font-weight: bold;
	line-height: 42px;
	margin: 0;
	right: 150px;
  	color: white;
  	font-size: 12px;
	text-align: center;
}

.tab ul.login li.left {
  	background: url(../images/tab_l.png) no-repeat left 0;
  	height: 42px;
	width: 30px;
	padding: 0;
	margin: 0;
  	display: block;
	float: left;
}

.tab ul.login li.right {
  	background: url(../images/tab_r.png) no-repeat left 0;
  	height: 42px;
	width: 30px;
	padding: 0;
	margin: 0;
  	display: block;
	float: left;
}

.tab ul.login li {
 	text-align: left;
  	padding: 0 6px;
	display: block;
	float: left;
	height: 42px;
  	background: url(../images/tab_m.png) repeat-x 0 0;
}

.tab ul.login li a {
	color: #15ADFF;
}

.tab ul.login li a:hover {
	color: white;
}

.tab .sep {color:#414141}

.tab a.open, .tab a.close {
	height: 20px;
	line-height: 20px !important;
	padding-left: 30px !important;
	cursor: pointer;
	display: block;
	width: 100px;
	position: relative;
	top: 11px;
}

.tab a.open {background: url(../images/bt_open.png) no-repeat left 0;}
.tab a.close {background: url(../images/bt_close.png) no-repeat left 0;}
.tab a:hover.open {background: url(../images/bt_open.png) no-repeat left -19px;}
.tab a:hover.close {background: url(../images/bt_close.png) no-repeat left -19px;}

/* sliding panel */
#toppanel {
    position: absolute;   /*Panel will overlap  content */
    /*position: relative;*/   /*Panel will "push" the content down */
    top: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

#panel {
	width: 100%;
	height: 270px;
	color: #999999;
	background: #272727;
	overflow: hidden;
	position: relative;
	z-index: 3;
	display: none;
}

#panel hh1 {
	font-size: 1.6em;
	padding: 5px 0 10px;
	margin: 0;
	color: white;
}

#panel hh2{
	font-size: 1.2em;
	padding: 10px 0 5px;
	margin: 0;
	color: white;
}

#panel p {
	margin: 5px 0;
	padding: 0;
}

#panel a {
	text-decoration: none;
	color: #15ADFF;
}

#panel a:hover {
	color: white;
}

#panel a-lost-pwd {
	display: block;
	float: left;
}

#panel .contento {
	width: 960px;
	margin: 0 auto;
	padding-top: 15px;
	text-align: left;
	font-size: 0.85em;
}

#panel .contento .left {
	width: 280px;
	float: left;
	padding: 0 15px;
	border-left: 1px solid #333;
}

#panel .contento .right {
	border-right: 1px solid #333;
}

#panel .contento form {
	margin: 0 0 10px 0;
}

#panel .contento label {
	float: left;
	padding-top: 8px;
	clear: both;
	width: 280px;
	display: block;
}

#panel .contento input.field {
	border: 1px #1A1A1A solid;
	background: #414141;
	margin-right: 5px;
	margin-top: 4px;
	width: 200px;
	color: white;
	height: 16px;
}

#panel .contento input:focus.field {
	background: #545454;
}

/* BUTTONS */
/* Login and Register buttons */
#panel .contento input.bt_login,
#panel .contento input.bt_register {
	display: block;
	float: left;
	clear: left;
	height: 24px;
	text-align: center;
	cursor: pointer;
	border: none;
	font-weight: bold;
	margin: 10px 0;
}

#panel .contento input.bt_login {
	width: 74px;
	background: transparent url(../images/bt_login.png) no-repeat 0 0;
}

#panel .contento input.bt_register {
	width: 94px;
	color: white;
	background: transparent url(../images/bt_register.png) no-repeat 0 0;
}

#panel .lost-pwd {
	display: block;
	float:left;
	clear: right;
	padding: 15px 5px 0;
	font-size: 0.95em;
	text-decoration: underline;
}




et le css de index.php :

/* =================== Getting the new tags to behave START ====================== */

article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video { display: block; }
mark, rp, rt, ruby, summary, time { display: inline }

/* ==================== Getting the new tags to behave END ======================= */





/* ========================= Global properties START ============================= */

body {
	background: #000;
	min-width: 980px;
	height: 100%;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1em;
	color: #bebebe;
}

html {
	background: transparent;
	min-width: 980px;
	height: 100%;
	margin: 0;
	padding: 0;
	outline: 0;
	vertical-align: top;
	font-size: 100%;
}

div {
	border: 0 none;
	font-size: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: top;
}

a {
	outline: none;
	color: #11b6fb;
}

	a:hover {
		text-decoration: none;
	}
	
/* ========================= Global properties END =============================== */






/* ========================= Global Structure START ============================== */

#main-tail {
	background: url(../images/main-tail.gif) repeat 50% 204px;
}

#main-tail-top {
	background: url(../images/main-tail-top.gif) repeat-x 50% 0%;
}

#main-tail-bot {
	background: url(../images/main-tail-bot.gif) repeat-x 50% 100%;
}

#main {
	width: 970px;
	margin: 0 auto;
	font-size: 0.75em;
}

header {
	position: relative;
	height: 217px;
}

section#content {
	width: 100%;
}

footer {
	height: 123px;
	overflow: hidden;
}

/* ========================= Global Structure END ================================ */






/* ====================== Left & Right alignment START =========================== */

.fleft {
	float: left;
}

.fright {
	float: right;
}

	ul.fright {
		padding: 0 13px 0 0;
	}

.col-1, .col-2, .col-3, .col-4 {
	float: left;
	overflow: hidden;
}

.block-1, .block-2, .block-3, .block-4 {
	float: left;
	overflow: hidden;
}

.aligncenter {
	padding: 15px 0 0 0;
	text-align: center;
}

.wrapper {
	width: 100%;
	overflow: hidden;
}

.clear {
	clear: both;
	font-size: 0%;
	line-height: 0%;
	height: 0;
}

/* ====================== Left & Right alignment END ============================= */





/* ============================== header START =================================== */

header strong {
	display: block;
	line-height: 1.333em;
	font-size: 1em;
	font-weight: normal;
	color: #f0f0f0;
	position: absolute;
	top: 71px;
	left: 157px;
}

#navi {
	background: #11b6fb;
	padding: 0 10px 0 14px;
	position: absolute;
	top: 0;
	right: 1px;
}

	#navi li {
		float: left;
	}
	
		#navi li a {
			background: #11b6fb;
			float: left;
			height: 32px;
			padding: 0 10px 0 8px;
			line-height: 32px;
			text-decoration: none;
			color: #fff;
		}
		
		#navi li a:hover {
			color: #000;
		}

#type {
	position: absolute;
	top: 108px;
	left: 0;
}

	#type li {
		float: left;
		padding: 0 0 0 1px;
	}
	
		#type li a {
			float: left;
			height: 47px;
			overflow: hidden;
			padding: 0 9px 0 9px;
			line-height: 48px;
			font-size: 1.583em;
			text-decoration: none;
			color: #6b6b6b;
		}
		
		#type li.act a {
			background: #000;
			color: #fff;
		}
		
		#type li a:hover {
			background: #000;
			color: #fff;
		}

nav {
	position: absolute;
	top: 155px;
	left: 10px;
}

	nav ul {
		overflow: hidden;
	}
	
		nav ul li {
			float: left;
			padding: 0 21px 0 0;
			line-height: 50px;
			font-size: 1em;
			text-transform: uppercase;
			color: #fff;
		}
		
			nav ul li a {
				float: left;
				height: 49px;
				overflow: hidden;
				text-decoration: none;
				color: #fff;
			}
			
				nav ul li a:hover {
					color: #11b6fb;
				}
			
			nav ul li.act a {
				color: #11b6fb;
			}

/* =============================== header END ==================================== */





/* ============================= content START =================================== */

#content {
	background: url(../images/content.gif) repeat-y 0% 0%;
}

	#content #indent {
		padding: 13px 16px 16px 14px;
	}
	
		#content p {
			padding: 0 0 18px 0;
			line-height: 1.5em;
			font-size: 1em;
			color: #bebebe;
		}

/* ============================== content END ==================================== */



/* ============================= JS START ===================================== */

#gallery {
	position: relative;
	width: 938px;
	height: 467px;
	overflow: hidden;
	margin: 0 0 16px 0;
}

#faded {
	width: 938px;
	height: 467px;
}

ul.pagination {
	position: absolute;
	top: 0;
	right: 0;
}

	ul.pagination li {
		padding: 0 0 1px 0;
	}
	
		ul.pagination li a {
			background: url(../images/pagination.gif) no-repeat 0% 0%;
			display: block;
			width: 206px;
			height: 74px;
			padding: 10px 25px 32px 40px;
			overflow: hidden;
			line-height: 1.5em;
			font-size: 1em;
			text-decoration: none;
			color: #8b8b8b;
		}
		
		ul.pagination li a.extra {
			background: url(../images/pagination-1.gif) no-repeat 0% 0%;
		}
		
			ul.pagination li.current a, ul.pagination li a:hover {
				background-position: 0% -116px !important;
				color: #1b1b1b;
			}
			
		ul.pagination li a strong {
			display: block;
			padding: 0 0 1px 0;
			text-transform: uppercase;
			color: #11b6fb;
		}
			
			ul.pagination li.current a strong, ul.pagination li a:hover strong {
				color: #fff;
			}
	
/* ============================== JS END ====================================== */





/* =================== txt, links, lines, titles START =========================== */

h1 {
	position: absolute;
	top: 39px;
	left: 3px;
}

	h1 a {
		background: url(../images/logo.gif) no-repeat 0% 0%;
		display: block;
		width: 151px;
		height: 45px;
		overflow: hidden;
	}
	
		h1 a span {
			display: none;
		}

h2 {
	background: #11b6fb;
	height: 45px;
	margin: 0 0 1px 0;
	padding: 0 0 0 19px;
	overflow: hidden;
	line-height: 42px;
	font-size: 1.5em;
	text-transform: uppercase;
	color: #fff;
}

h3 {
	background: #fff;
	height: 45px;
	margin: 0 0 1px 0;
	padding: 0 0 0 18px;
	overflow: hidden;
	line-height: 44px;
	font-size: 1.5em;
	text-transform: uppercase;
	color: #2f2f2f;
}

h4 {
	background: #262626;
	height: 45px;
	margin: 0 0 1px 0;
	padding: 0 0 0 17px;
	overflow: hidden;
	line-height: 44px;
	font-size: 1.5em;
	text-transform: uppercase;
	color: #fff;
}

h5 {
	padding: 0 0 7px 0;
	line-height: 1.5em;
	font-size: 1em;
	text-transform: uppercase;
	color: #fff;
}

h6 {
	padding: 0 0 7px 0;
	line-height: 1.5em;
	font-size: 1em;
	text-transform: uppercase;
	color: #11b6fb;
}

	h6 strong {
		display: block;
		padding: 0 0 20px 0;
	}

.link {
	background: #fff url(../images/arrow-2.gif) no-repeat 100% 13px;
	float: right;
	height: 31px;
	padding: 0 18px 0 10px;
	line-height: 28px;
	font-weight: bold;
	text-decoration: none;
	color: #262626;
}
	
	.link:hover {
		background: #bebebe url(../images/arrow-2.gif) no-repeat 100% 13px;
	}

.list {
	overflow: hidden;
}

	.list li {
		background: url(../images/marker.gif) no-repeat 0% 9px;
		padding: 0 0 0 12px;
		line-height: 1.917em;
		font-size: 1em;
		color: #000;
	}
	
		.list li a {
			color: #000;
		}

.list-1 {
	width: 100%;
	padding: 0 0 19px 0;
	overflow: hidden;
}

	.list-1 li {
		float: left;
		width: 234px;
		padding: 0 1px 0 0;
	}
	
	.list-1 li.last {
		padding: 0;
	}
	
		.list-1 li a {
			background: #2f2f2f;
			display: block;
			padding: 17px 20px 18px 19px;
			line-height: 1.5em;
			font-size: 1em;
			text-decoration: none;
			color: #bebebe;
		}
		
			.list-1 li a strong {
				display: block;
				padding: 0 0 10px 1px;
				text-transform: uppercase;
				color: #11b6fb;
			}
			
			.list-1 li a b {
				background: url(../images/arrow.gif) no-repeat 100% 6px;
				padding: 0 7px 0 7px;
				color: #fff;
			}
		
		.list-1 li.extra a {
			background: #262626;
		}
		
		.list-1 li a:hover {
			background: #fff;
			color: #6d6d6d;
		}
		
			.list-1 li a:hover b {
				background: url(../images/arrow-1.gif) no-repeat 100% 6px;
				color: #161616;
			}

.list-2 {
	width: 100%;
	overflow: hidden;
}

	.list-2 li {
		width: 100%;
		padding: 0 0 1px 0;
		overflow: hidden;
		vertical-align: top;
	}
	
		.list-2 li img {
			float: left;
		}
		
		.list-2 li a {
			background: #2f2f2f;
			display: block;
			width: 194px;
			min-height: 108px;
			height: auto !important;
			height: 108px;
			padding: 16px 20px 10px 21px;
			float: left;
			line-height: 1.5em;
			font-size: 1em;
			text-decoration: none;
			color: #bebebe;
		}
		
			.list-2 li a strong {
				display: block;
				padding: 0 0 7px 0;
				text-transform: uppercase;
				color: #11b6fb;
			}
			
			.list-2 li a b {
				background: url(../images/arrow.gif) no-repeat 100% 6px;
				padding: 0 7px 0 7px;
				color: #fff;
			}
			
		.list-2 li.extra a {
			background: #262626;
		}
		
		.list-2 li a:hover {
			background: #fff;
			color: #6d6d6d;
		}
		
			.list-2 li a:hover b {
				background: url(../images/arrow-1.gif) no-repeat 100% 6px;
				color: #161616;
			}

.list-3 {
	overflow: hidden;
}

	.list-3 li {
		width: 100%;
		padding: 0 0 1px 0;
		overflow: hidden;
		vertical-align: top;
	}
	
		.list-3 li a {
			background: #11b6fb;
			display: block;
			min-height: 119px;
			height: auto !important;
			height: 119px;
			padding: 15px 19px 0 19px;
			line-height: 1.5em;
			font-size: 1em;
			font-weight: bold;
			text-decoration: none;
			text-transform: uppercase;
			color: #fff;
		}
		
			.list-3 li a:hover {
				background: #fff;
				color: #11b6fb;
			}

.list-4 {
	width: 100%;
	overflow: hidden;
}

	.list-4 li {
		width: 100%;
		padding: 0 0 1px 0;
		overflow: hidden;
		vertical-align: top;
	}
		
		.list-4 li a {
			background: #2f2f2f;
			display: block;
			min-height: 109px;
			height: auto !important;
			height: 109px;
			padding: 15px 20px 10px 18px;
			line-height: 1.5em;
			font-size: 1em;
			text-decoration: none;
			color: #bebebe;
		}
		
			.list-4 li a strong {
				display: block;
				padding: 0 0 8px 0;
				text-transform: uppercase;
				color: #fff;
			}
			
			.list-4 li a b {
				background: url(../images/arrow-3.gif) no-repeat 100% 6px;
				padding: 0 7px 0 7px;
				color: #11b6fb;
			}
			
		.list-4 li.extra a {
			background: #262626;
		}
		
		.list-4 li a:hover strong {
			color: #11b6fb;
		}

.list-5 {
	overflow: hidden;
}

	.list-5 li {
		background: url(../images/marker-1.gif) no-repeat 0% 9px;
		padding: 0 0 0 12px;
		line-height: 1.917em;
		font-size: 1em;
		color: #11b6fb;
	}
	
		.list-5 li a {
			color: #11b6fb;
		}

/* ==================== txt, links, lines, titles END ============================ */





/* ============================= forms START ===================================== */

#contact-form {
	width: 100%;
	overflow: hidden;
}

#login-form {
	width: 342px;
	height: 23px;
	overflow: hidden;
	position: absolute;
	top: 44px;
	right: 0;
}

	#login-form b {
		background: url(../images/login-input.gif) no-repeat 0% 0%;
		display: block;
		width: 83px;
		height: 23px;
		padding: 0 2px 0 0;
		overflow: hidden;
		float: left;
		font-weight: normal;
	}
	
		#login-form b input {
			background: none;
			width: 69px;
			height: 13px;
			padding: 5px 7px 5px 7px;
			border: none;
			float: left;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 0.917em;
			color: #b8b8b8;
		}
		
	#login-form input#login-submit {
		background: #f2f2f2;
		width: 43px;
		height: 23px;
		border: none;
		float: left;
		margin: 0 7px 0 0;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.917em;
		font-weight: bold;
		color: #171717;
		cursor: pointer;
	}
	
	#login-form span {
		float: left;
		margin: -1px 0 0 0;
		line-height: 1.091em;
		font-size: 0.917em;
		color: #f2f2f2;
	}
	
		#login-form span a {
			text-decoration: none;
			color: #f2f2f2;
		}
		
		#login-form span a:hover {
			color: #b8b8b8;
		}
		
	#login-form em {
		display: block;
		width: 122px;
		float: left;
		line-height: 1.091em;
		font-size: 0.917em;
		font-style: normal;
		color: #11b6fb;
	}
	
		#login-form em a {
			text-decoration: none;
			color: #f2f2f2;
		}
		
		#login-form em a:hover {
			color: #b8b8b8;
		}

#search-form {
	background: url(../images/search-input.gif) no-repeat 0% 0%;
	width: 263px;
	height: 23px;
	overflow: hidden;
	position: absolute;
	top: 83px;
	right: 1px;
}

	#search-form input {
		background: none;
		width: 198px;
		height: 13px;
		padding: 5px 7px 5px 7px;
		border: none;
		float: left;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.917em;
		color: #b8b8b8;
	}
	
	#search-form a {
		background: #11b6fb;
		width: 49px;
		height: 23px;
		overflow: hidden;
		float: left;
		margin: 0 0 0 2px;
		line-height: 22px;
		font-size: 0.917em;
		font-weight: bold;
		text-align: center;
		text-decoration: none;
		color: #fff;
	}
	
	#search-form a:hover {
		color: #000;
	}

/* ============================== forms END ====================================== */





/* ============================= other START ===================================== */

.pic-indent {
	margin: 0 0 26px 0;
}

.info-box {
	background: #262626;
	margin: 0 0 1px 0;
}

	.info-box .inner {
		padding: 28px 20px 12px 20px;
	}

.info-box-1 {
	background: #11b6fb;
	width: 100%;
	overflow: hidden;
	margin: 0 0 1px 0;
}

	.info-box-1 .inner {
		padding: 28px 20px 31px 19px;
	}
	
	.info-box-1 p {
		padding: 0 0 14px 0 !important;
		line-height: 1.5em !important;
		font-size: 1em !important;
		color: #fff !important;
	}

.info-box-2 {
	background: #fff;
	width: 100%;
	overflow: hidden;
	margin: 0 0 1px 0;
}

	.info-box-2 .inner {
		padding: 15px 20px 33px 19px;
	}

.privacy {
	background: #262626;
	padding: 28px 30px 21px 20px;
}

	.privacy dl {
		overflow: hidden;
	}
	
		.privacy dl dt {
			padding: 0 0 12px 0;
			line-height: 1.5em;
			font-size: 1em;
			font-weight: bold;
			text-transform: uppercase;
			color: #11b6fb;
		}
		
			.privacy dl dt a {
				text-decoration: none;
				color: #11b6fb;
			}
			
			.privacy dl dt a:hover {
				text-decoration: underline;
			}
			
		.privacy dl db {
			padding: 0 0 12px 0;
			line-height: 1.5em;
			font-size: 1em;
			font-weight: bold;
			text-transform: uppercase;
			color: #11b6fb;
		}
		
			.privacy dl db a {
				text-decoration: none;
				color: #11b6fb;
			}
			
		.privacy dd {
			padding: 0 0 22px 0;
			line-height: 1.5em;
			font-size: 1em;
			color: #bebebe;
		}

/* ============================== other END ====================================== */





/* ============================ footer START ===================================== */

footer .inner {
	padding: 41px 20px 0 13px;
}

footer strong {
	float: right;
	line-height: 1.5em;
	font-size: 1em;
	color: #fff;
}

	footer strong a {
		text-decoration: none;
		color: #11b6fb;
	}
	
	footer strong a:hover {
		text-decoration: underline;
	}

footer p {
	float: right;
	line-height: 1.5em;
	font-size: 1em;
	font-weight: bold;
	color: #fff;
}

	footer p a {
		margin: 0 0 0 9px;
		text-decoration: none;
		color: #11b6fb;
	}
	
	footer p a:hover {
		text-decoration: underline;
	}

.type {
	float: left;
	padding: 0 0 3px 0;
}

	.type li {
		float: left;
		padding: 0 21px 0 0;
		line-height: 1.5em;
		font-size: 1em;
		color: #11b6fb;
	}
	
		.type li a {
			text-decoration: none;
			color: #11b6fb;
		}
		
		.type li.act a {
			color: #fff;
		}
		
		.type li a:hover {
			color: #fff;
		}

.menu-bot {
	float: left;
}

	.menu-bot li {
		float: left;
		padding: 0 22px 0 0;
		line-height: 1.5em;
		font-size: 1em;
		color: #757474;
	}
	
		.menu-bot li a {
			text-decoration: none;
			color: #757474;
		}
		
		.menu-bot li a:hover {
			text-decoration: underline;
		}

/* ============================= footer END ====================================== */
non ca n'est pas une utilisation correcte, si tu veux avoir 2 css différente en fonction des pages (ce qui ne rime absoluement à rien car tu devrait plutot avoir différentes classes) alors il faut que dans l'index.php tu met tes 2 link de css, on va procéder comme ceci :

dans index.php tu met tes 2 css dans un premier temps (j'utilise des nom fictifs):


<link rel="stylesheet" type="text/css" href="login_panel/css/style2.css" />
<link rel="stylesheet" type="text/css" href="login_panel/css/style1.css" />


tu créé une variable dans demo.php

$changeCss = 1;


ensuite tu conditionnes le tout :


if(isset($changeCss)) { // si on a le fichier demo.php alors on aura ce css
echo "<link rel='stylesheet' type='text/css' href='login_panel/css/style2.css' />";
}
else { // sinon
echo "<link rel='stylesheet' type='text/css' href='login_panel/css/style1.css' />";
} // je met des acolades car je ne connais pas ta version de php


Ca te convient ?

Mais bon, je me demande encore pourquoi tu ne met pas tout ton style dans un seul css ?
Modifié par ptitvincent (23 Aug 2011 - 10:54)
Je suis complètement perdu... Smiley confus
As tu une version en ligne? ce sera peut être plus simple de cerner le problème...
jessjc a écrit :
j'ai mis mes 2 css dans le même mais ça ne fonctionne pas????


juste les mètres dans le même php ne suffit pas. As tu suivis ce que je t'ai expliqué à la lettre ?
jb_gfx a écrit :
C'est pas toi qui est perdu... Smiley lol


C'est sûr...Mais ces kilomètres de codes dans un forum me rebutent toujours un peu et complexifie la compréhension, non? pas vous?
Modifié par hophop (23 Aug 2011 - 14:10)
en fait mon css contient les même catégories il suffit juste que je les modifie. merci quand même!
a écrit :
il garde quand même le css de la page index


Non c'est impossible, tu n'as pas bien appliqué ce que je t'ai expliqué, sinon ca marcherait sans soucis.
jessjc a écrit :
en fait mon css contient les même catégories il suffit juste que je les modifie. merci quand même!


bah, c'est ce qu'on disait depuis le début... Smiley biggol