28173 sujets

CSS et mise en forme, CSS3

Bonjour,
Je viens de terminer un menu déroulant pour mon site perso.
Il fonctionne très bien sous Safari, FF(mac) et IE, mais sous Opéra (mac et peut-être pc) il se balade complètement, et ce uniquement sur les pages dans lesquelles sont inclues des anims flash...
Quelqu'un connait-il une solution à ce problème ?

voici une page avec flash
et une autre sans

et mon code css:

/*<group=styles généraux>*/

body {
	background: #000000 no-repeat url(images/draw/draw-grey.jpg) center 120px  fixed;
	text-align: center;
	margin: 0 0 15px;
	font: 12px 'Lucida Grande', Geneva, Arial, Verdana, sans-serif;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
	padding: 0;
}

p {
	font: 18px Times New Roman, Times, serif;
	text-align: justify;
}

b, strong {

}

.center {
	text-align: center;
}

.underline {
	text-decoration: underline;
}

tbody {
	background: url(images/page/transp-light.png);
}

td {
	padding: 5px;
	text-align: left;
}

.colgoch {
	width: 30%;
	text-decoration: underline;
	font-weight: bold;
	text-align: left;
	vertical-align: baseline;
}

.coldroite {
	width: 70%;
	vertical-align: baseline;
	text-align: justify;
	font-size: 16px;
}

a:link {
	text-decoration: none;
	color: #003c7d;
	text-shadow: 0px 0px 0px #000000;
}

a:visited {
	text-decoration: none;
	color: #003c7d;
	text-shadow: 0px 0px 0px #000000;
}

a:hover, a:active {
	color: black;
	text-shadow: 2px 2px 1px #d9d9d9;	
}

img {
	border-style: none;
}

.image-left {
	float: left;
	margin: 3px 3px 3px 0;
	padding: 3px 3px 3px 0;
}

.image-right {
	float: right;
	margin: 3px 0 3px 3px;
	padding: 3px 0 3px 3px;
}

object {
	border-style: none;
	z-index:-1;
}


	
/*</group>*/

/*<group=toolbar>*/

#navcontainer {
	position: relative;
	z-index:1000;
	font: 11px/1.9em Verdana;
	text-decoration: none;
	width: 831px;
	bottom: 1px;
	height: 65px;
	clear: both;
}

#navcontainer #current {
	text-shadow: 0px 0px 3px #white;
	background: none no-repeat;
}

#navcontainer .currentAncestor {
	color: #white;
	text-shadow: 0px 0px 1px #white;
	background: transparent;
}

/* Menu coulissant !! */

#navcontainer ul li ul {
	display: none;
}
#navcontainer ul li:hover>ul {
	display: block;
	position: relative;
	z-index:1000;
	background: transparent;
	top: 0;
	border-style: none;
}

/* niveau 1 */

#navcontainer ul {
	list-style: none;
	position: absolute;
	z-index: 1000;
    background: repeat-x url(images/colors/toolbar-black.gif);
	width: 831px;
	display: block;
	margin: 0;
	padding: 0;
}

#navcontainer ul li {
	display: block;
	float: left;
}


#navcontainer ul a{
	width: 115px;
	display: block;
	text-align: center;
	height: 20px;
	color: #d2d2d2;
	text-shadow: 0px 1px 0px #black;
	text-decoration: none;
	border-style: none;
	
}

#navcontainer ul  a:hover {
	color: white;
	text-shadow: 0px 0px 3px #white;
	text-decoration: none;
	border-style: none;
	cursor: hand;
}

/* niveau 2 */

#navcontainer ul ul {
	position: relative;
	top: 20px;
	background: transparent;
	display: block;
	width: 115px;
}

#navcontainer ul ul li {
	background: transparent url(images/colors/toolbar2.jpg);
	color: black;
	position: relative;
	float: none;
}

#navcontainer ul ul li.last {
	background: url(images/colors/toolbar3.gif);
	 
}

#navcontainer ul ul a {
	height: 25px;
	color: black;
	margin-right: 0;
	margin-left: 0;
	width: 115px;
	text-shadow: 0px 1px 0px #d6d6d6;
	text-decoration: none;
	border-style: none;
	color: #252525;
	background: transparent;
	display: block;
}



#navcontainer ul ul .currentAncestor {
	color: #0075ba;
	text-shadow: 0px 1px 0px #d6d6d6;
}

/*</group>*/

/*<group=global >*/

.standout, blockquote {
	border: inherit;
	color: #3f3f3f;
	margin: 0 10px;
	font-weight: bold;
	padding-right: 10px;
	padding-left: 10px;
}

h1 {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #000000;
	margin: 0px;
}

h2 {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #191919;
	margin: 0px;
}

h3 {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	color: #000000;
	margin: 0px;
}

h4 {
}

h5 {
	
}

.imageStyle {
	border: 1px none transparent;
}
/*</group>*/

/*<group=layout>*/

.clearer {
	clear: both;
}

#container {
	text-align: left;
	margin-right: auto;
	margin-left: auto;
	padding: 0;
	width: 831px;
	background: url(images/page/transp1.png);
	margin-top: 10px;
}

#pageHeader {
	height: 143px;
	position: relative;
	background: transparent;
	margin: 0;
	padding: 0;
}

#contentContainer {
	margin-bottom: 6px;
	background: transparent;
	margin-top: 6px;
	font-weight: 500;
	line-height: 17px;
	font-family: Arial, Helvetica, sans-serif;
}

#contentContainer #content {
	padding: 10px;
	margin-right: 7px;
	margin-left: 0;
	font-size: 12pt;
	z-index:-1000;
}

#contentContainer #content .texte {
	background: url(images/page/transp-light.png);
	padding: 10px;
	font-size: 16pt;
	line-height: 1em;
}

#contentContainer #content .texte ol       {
	font-size: 16pt;
	line-height: 1em;
	font-weight: 500;
}

#sidebarContainer {
	width: 220px;
	float: right;
	clear: left;
	font-size: 11px;
	line-height: 16px;
	background: transparent ;
}

#sidebarContainer #sidebar {
	padding: 5px 10px;
	background: transparent repeat url(images/page/transp1.png);
}

#sidebarContainer .sideHeader {
	font-weight: bold;
	background: 0px transparent repeat url(images/page/transp-light.png);
	color: black;
	font-size: 12px;
	padding: 3px 10px;
	margin-bottom: 7px;
	margin-top: 7px;
	text-align: center;
}

#footer {
	text-align: right;
	padding-bottom: 0;
	margin-top: 0;
	margin-right: 0;
	margin-left: 0;
	height: 20px;
	font-size: 10pt;
	padding-right: 30px;
	padding-left: 30px;
	color: black;
}

#footer p {
	padding: 0;
	margin: 0;
}

#footer a:link, #footer a:visited {
	color: black;
	text-decoration: none;
	font-weight: bold;
	
}

#footer a:hover, #footer a:active {
	text-decoration: underline;
	color: black;	
}
	
/*</group>*/

/*<group=fil d'ariane>*/

#breadcrumbcontainer {
	text-align: center;
	background: transparent;
	font-size: 10pt;
	padding: 0 15px;
	line-height: 22px;
	margin-top: 0;
	margin-bottom: 0;
}

#breadcrumbcontainer ul {
	list-style: none;
	padding: 0;
}

#breadcrumbcontainer li {
	display: inline;
	padding: 0;
}

#breadcrumbcontainer a {
	text-decoration: none;
	color: black;
}

#breadcrumbcontainer a:hover {
	text-decoration: underline;
	color: black;
}
	
/*</group>*/

/*<group=formulaires>*/

fieldset {
	border: ridge #e6d1fb thin;
}
.message-text {font-size: 15px } 

.required-text {font-size: 15px } 

.form-input-field {
	background: #e9e9e9;
} 

.form-input-button { } 
/*</group>*/

/*<group=blog>*/

/* The archive page */

.blog-archive-background {
	text-align: center;
	font: 12px 'Lucida Grande', Geneva, Arial, Verdana, sans-serif;
}

.blog-archive-headings-wrapper {
	font-weight: bold;
	margin: 831px;
	background: url(images/page/transp1.png) repeat;
	height: 50px;
	text-align: left;
	padding: 10px;
	font-size: 15px;
}

.blog-archive-entries-wrapper {
	text-align: left; 
	text-align: left;
	background: white url(images/page/transp1.png) repeat;
	padding: 10px;
	margin: 831px;
}

.blog-archive-month {
	font-weight: bold;
	font-size: 24px;
	padding-bottom: 8px;
	text-align: left;
}

.blog-archive-link { 
}

/* end archive page */

.blog-entry {
	padding: 0px;
	margin-bottom: 25px;
}

.blog-entry-title {
	text-indent: 10px;
	font: bold 20px Geneva;
}

.blog-entry-date {
	margin-bottom: 15px;
	font-style: italic;
	font-size: 11px;	
	height: 17px;
	padding-right: 10px;
	padding-left: 10px;
	border-top: 1px solid gray;
}

.blog-entry-category {
}

.blog-category-link-enabled {
}

.blog-category-link-disabled {
}

.blog-entry-body {
	
	text-align: left;
	padding: 0px;
	font-family: 'Lucida Grande', Geneva, Arial, Verdana, sans-serif;
}

.blog-entry-comments {
	background: transparent url(images/page/transp-light.png)  repeat;
	border-bottom: 1px solid gray;
	margin-top: 5px;
	font-size: 11px;
	text-indent: 6px;
}

/*</group>*/