Hi,
I’m developping Asp.net webpages using visual studio.
Webpages look fine in IE but in firefox it’s a real mess
Here’s the css code of the master page and the default page.
Master Page
#charger
{
z-index:3000;
left:500px;
top:350px;
width:180px;
height:50px;
background-color:#DEE7F2;
text-align:center;
color:#254061;
position:fixed;
font-size: 16px;
font-family: Tahoma,sans-serif;
display:none;
padding:7px;
}
#espace5 {
width:inherit;
height:5px;
clear:both;
_height:auto;
}
#espace4 {
width:inherit;
height:4px;
clear:both;
_height:auto;
}
#espace3 {
width:inherit;
height:3px;
clear:both;
_height:auto;
}
#espace2 {
width:inherit;
height:2px;
clear:both;
_height:auto;
}
#espace1 {
width:inherit;
height:1px;
clear:both;
_height:auto;
}
#espacedot {
width:inherit;
height:0px;
clear:both;
border-top:1px dotted black;
_height:auto;
}
#dotlight {
width:inherit;
height:0px;
clear:both;
border-top:2px dotted black;
_height:auto;
}
body {
font-size: 11px;
color: #4B4B4B;
/*background-color: #B0C4DE;*/
background:url(../images/masterpage/background.png); /*Fond bleu dégradé*/
background-repeat: repeat-x;
height:100%;
overflow:scroll;
overflow-x:hidden;
+overflow:hidden;
/* cursor: url('../images/cursors/aero_busy.ani');*/
}
/* Références de fond bleu et gris #B0C4DE #B0E2FF #87CEEB #ADADAD #E0E0E0 #87CEFA */
/*-------------------------------------------------------------*/
#headall {
clear:both;
position:relative;
width:1000px;
height:101px;
top:-10px;
border: 0px solid royalblue;
z-index:500;
margin-top:10px;
}
#bottomcontent{
width:1100px;
height:100%;
position:relative;
padding-top:130px;
+padding-top:120px;
_padding-top:3px;
margin-top: -110px;
/*+margin-top:-90px;*/
top: 0px;
left: 0px;
overflow:hidden;
}
#footer {
clear: both;
position:relative;
width:1000px;
height:20px;
padding-top:5px;
text-align:center;
font-weight:normal;
color: #444;
left: 0px;
top: 0px;
margin-top:5px;
+margin-top:-7px;
margin-bottom:10px;
margin-left:auto;
margin-right:auto;
}
#wrapper {
margin:2px auto;
width:1000px;
padding:0;
background:#FFF;
}
/*-------------------------------------------------------------*/
a {
color:royalblue;
text-decoration:none;
}
a:hover{
text-decoration:underline;
}
/*---------------------------
a visited{ color:#990000; }
a:hover{
color:#F33;
text-decoration:underline;
}
------------------------------*/
input.focused {
font-size:10px;
}
input.focused {
border : 1px solid royalblue;
}
textarea {
border : 1px solid #ccc;
font-size: 12px;
font-family: Tahoma,sans-serif;
}
/* ----------------- general styles -------------------------------------------------------*/
ul { margin: 0; padding : 0; list-style : none; }
img { border: 0;}
.pic{margin-top:8px;}
/* ----------------- top info -------------------------------------------------------*/
#header {
clear:both;
width:1000px;
height:120px;
position:relative;
background: url(../images/masterpage/master_header.png) no-repeat;
border: 0px solid royalblue;
margin-top:-12px;
}
#bottom_menu
{
background:url(../images/contour_bas_master.png)no-repeat;
position: relative;
}
#title {float:left; width:240px; padding: 20px 0 10px 60px;}
#title h3 {font-size:12px; padding:5px 0 0 0; margin:0; color:#444;}
#hright {
float:right;
width:802px;
height:72px;
margin:0px 0 0 0;
}
#hrighttop {
width: 200px;
margin: -21px 2px 0 0;
padding: 0 5px 2px 0;
float:right;
text-align: right;
}
#title p {font-size: 0.9em; color: #808080; padding: 0; background: inherit;}
#menu { width: 540px; float:right; height: 100px; margin:2px 0 0 0; padding:0; text-align:right;}
#menu li { display:inline; }
#menu li a { color:#444; text-decoration:none; padding:1px 10px 1px 10px;
height:19px; background:none;}
#menu li a:hover { background: none;color:#631e19;}
/* ----------------- Main content -------------------------------------------------------*/
/* Style the legend, labels and the div containing the submit button. */
legend {
font-weight : bold;
font-size : 15px;
color : #87F717;
margin : 0;
padding : 0.5em;
}
/*#homepic {width:1000px; height:5px; /*background:url(../images/contact/contour_bas_master.png) no-repeat;*/
/*position: relative; margin:11px 0px 0px 0;z-index:20;}*/
#headertitre{
width:1000px;
height:20px;
margin:5px 0 0px 0;
z-index:500;
}
#search #s
{
margin-left:25px;
width: 150px;
height: 19px;
color: #000;
padding:0px;
margin-top:-1px;
}
#search #x {
width: 23px;
border:0px solid royalblue;
background:url(../images/tab/search.png) no-repeat;
}
#search #s:focus{
border:1px solid royalblue;
}
#search {
left:790px;
width: 220px;
margin: 0px 0px 0 0;
padding: 0 0px 0px 0;
position:absolute;
}
#searcher {
width: 21px;
height:21px;
position:absolute;
border: 1px solid royalblue;
margin-left:-5px;
float: right;
}
/* ----------------- superposition -----position fixed <<< relative-----------------------------*/
/* ------z-index fonctionnera quand div en même niveau------------------------------------------*/
#leftside {
float:left;
width: 776px;
_width: 752px;
height: 100%;
padding-top:0px;
padding-left:10px;
_padding-left:6px;
padding-right:10px;
_padding-right:0px;
border: 0px solid royalblue;
position:static;
z-index:100;
clear:both;
}
#rightside {
width: 206px;
height: 100%;
padding:0px;
padding-left:0px;
border: 0px solid royalblue;
overflow:hidden;
}
#photo_right {
top: 138px;
width: 205px;
/*height: 100%;*/
min-height: 100%;
margin-top:-130px;
border: 0px solid royalblue;
position: relative;
}
/* ----------------- Bottom content -------------------------------------------------------*/
/* ----------------- Partners Marquee content -------------------------------------------------------*/
#partnersmarquee {
background-color:transparent;
overflow:hidden;
margin-top:10px;
+margin-top:-5px;
border: 0px dashed #CCC;
height: 137px;
text-align: center;
float: left;
width: 200px;
display: none;
}
#partnersmarquee img {
border: 3px solid #F2F2F2;
display: block;
margin-top:20px;
}
#adsense {
margin-top:20px;/*45px*/
width: 190px;
padding:3px;
margin-left:-5px;
height: 100%;
border: 0px solid royalblue;
position:static;
overflow:hidden;
}
#ldb
{
width:220px;
padding:3px;
margin-top:-100px;
/*+margin-top:100px;*/
margin-left:-3px;
position: relative;
display: none;
}
#titre_ldb {
position: relative;
width: 100%;
height: 17px;
font-family: Arial Narrow,sans-serif;
font-size:17px;
margin-top:0px;
padding:5px;
font-weight: bold;
color:#79aa38;
}
#ldb_intero {
width:20px;
height:20px;
border: 0px solid royalblue;
position:absolute;
right:10px;
top:-4px;
the default page:
h2 {
font-weight:bold;
background: url(../images/tab/tab_bleu.jpg) repeat-x;
font-size:12px;
padding:0px 0 4px 0px;
margin: 0 0 2px 0;
color:royalblue;
background:none;
border-bottom: 2px dotted #444;
}
h3 {
font-weight:bold;
font-size:11px;
color:royalblue;
background:none;
margin-top:5px;
border-top: 2px dotted #444;
}
ul { margin: 0; padding : 0; list-style : none; }
img { border: 0;}
h4 {font: 30px 'HelveticaNeue-CondensedBold', 'Arial Narrow', Helvetica, Arial, sans-serif; margin:0;}
.pic{margin-top:5px; }
/* ----------------- top info -------------------------------------------------------*/
#title {float:left; width:240px; padding: 20px 0 10px 60px;}
#title h3 {font-size:12px; padding:5px 0 0 0; margin:0; color:#444;}
#hright {
float:right;
width:801px;
height:72px;
margin:0px 0 0 0;
}
#hrighttop {
width: 200px;
margin: -21px 2px 0 0;
padding: 0 5px 2px 0;
float:right;
text-align: right;
}
#title p {font-size: 0.9em; color: #808080; padding: 0; background: inherit;}
#menu { width: 540px; float:right; margin:2px 0 0 0; padding:0; text-align:right;}
#menu li { display:inline; }
#menu li a { color:#444; text-decoration:none; padding:1px 10px 1px 10px;
height:19px; background:none;}
#menu li a:hover { background: none;color:#631e19;}
/* ----------------- reglage du cadre pic -------------------------------------------------------*/
#picleft_btn {
width:40px;
height:40px;
border: 0px solid royalblue;
position:absolute;
left:355px;
top:3px;
}
#picbottom_btn {
width:40px;
height:40px;
border: 0px solid royalblue;
position:absolute;
left:751px;
top:372px;
}
#picright_btn {
width:40px;
height:40px;
border: 0px solid royalblue;
position:absolute;
left:751px;
top:3px;
}
#picright_text {
float:left;
width:325px;
height:56px;
border: 2px solid royalblue;
padding:2px;
padding-bottom:0px;
margin-left:48px;
}
/* ----------------- pic changer en MouseOver -------------------------------------------------------*/
#picleft {
left: 4px;
position: relative;
top: 20px;
width: 381px;
height:58px;
}
#picright {
background-color: #FFFFFF;
left: 0px;
position: relative;
top: 51px;
width: 381px;
height:65px;
}
.large_right {
border: 0px solid #000000;
display: block;
height: 273px;
width: 404px;
margin-left:-370px;
position: relative;
top: 2px;
z-index:1000;
}
.large_left {
border: 0px solid #000000;
display: block;
height: 273px;
width: 404px;
margin-left:-350px;
position: relative;
top: 2px;
z-index:1000;
}
.largebas {
border: 0px solid #000000;
display: block;
height: 270px;
width: 380px;
left: -346px;
position: relative;
top: -330px;
z-index:1000;
}
/* Style the legend, labels and the div containing the submit button. */
legend {
font-weight : bold;
font-size : 15px;
color : #333;
margin : 0;
padding : 0.5em;
}
#titrepreface
{
float: left;
width: auto;
margin: 5px 2px 0 0;
padding: 0 5px 2px 0;
}
#search #s {
width: 160px;
color: #999;
padding:2px;
}
#search #x {
width: 80px;
}
#search #s:focus{
border:1px solid royalblue;
}
#search {
float: right;
width: auto;
margin: 5px 0px 0 0;
padding: 0 0px 2px 0;
}
#login {
width: 811px;
margin: 5px 2px 0 0;
padding: 0 0px 0px 0;
}
#login2 {
width: 285px;
margin: 5px 2px 0 0;
padding: 0 0px 0px 0;
text-align: right;
}
#login #e {
width: 65px;
}
#login #c {
width: 50px;
}
#login #cer {
width: 65px;
}
#login #a {
width: 90px;
}
#login2 #ca {
float: right;
width: 90px;
}
/*#homepic {width:1000px; height:50px; margin:5px 0px 10px 0;z-index:20;}*/
.message{ position:absolute; width:360px; float:left; margin:70px 0px 0px 165px; color:#fff;}
.left1 li {
margin-left:15px;
+margin-left:0px;
}
#titre1_left1
{
/*background: url( '../../images/tab/tab_bleu_20px.jpg' );*/
left: -5px;
_left:0px;
_margin-left:-10px;
position: relative;
top: -8px;
_top: 0px;
width: 385px;
_width: 358px;
height: 20px;
border: 0px solid royalblue;
font-size: 15px;
font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
font-weight: bold;
color: green;
}
#titre1_left1_test
{
background: url( '../../images/tab/tab_bleu_20px.jpg' );
left: 355px;
top: 2px;
width: 10px;
height: 21px;
border: 0px solid royalblue;
font-size: 15px;
font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
font-weight: bold;
color: white;
position:absolute;
}
#titre3_left1
{
color:Green;
_margin-left:-10px;
position: relative;
top: 0px;
_top: 0px;
width: 788px;
height: 20px;
border: 0px solid royalblue;
font-size: 15px;
font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
font-weight: bold;
color: white;
}
#onglet
{
background: url( '../../images/g748rec.png' );
background-repeat:no-repeat;
padding-left:5px;
padding-top:4px;
margin-top:-42px;
height:163px;
margin-left:8px;
width:374px;
}
#onglet2
{
background: url( '../../images/g767rec.png' );
background-repeat:no-repeat;
padding-left:5px;
padding-top:0px;
position:absolute;
margin-top:-70px;
width:420px;
margin-left:8px;
}
#ongletRight1
{
background: url( '../../images/g748rec.png' );
background-repeat:no-repeat;
padding-left:5px;
padding-top:4px;
height:163px;
margin-left:7px;
margin-top:12px;
width:374px;
}
#ongletRight2
{
background: url( '../../images/image3565.png' );
background-repeat:no-repeat;
padding-left:5px;
padding-top:0px;
position:absolute;
margin-top:-94px;
width:380px;
margin-left:7px;
}
#bottom_left1
{
width:360px;
height:30px;
border: 0px solid royalblue;
position:absolute;
_position:relative;
top:265px;
+bottom:0px;
}
#bottomcontent1{
width:1098px;
height:100%;
position:relative;
top: 0px;
left: 0px;
}
.left1 {
float: left;
width: 377px;
height: 350px;
/*width:75%;
height:75%;*/
+height: 350px;
margin: 0px 6px -10px -15px;
margin-left: -10px;
padding:7px;
_padding:0px;
padding-left:11px;
overflow: hidden;
/*border: 1px solid royalblue;*/
z-index:1000;
margin-top:7px;
}
.middle1 {
float: left;
width: 377px;
height: 340px;
+height: 335px;
margin: 0 6px 5px 0;
padding:10px;
_padding:0px;
padding-left:6px;
z-index:1000;
margin-top:7px;
margin-left:-4px;
}
.middle1 li {
margin-left:15px;
+margin-left:0px;
}
#titre1_middle1 {
left: -5px;
position: relative;
top: -8px;
width: 401px;
height: 20px;
border: 0px solid royalblue;
font-size: 15px;
font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
font-weight: bold;
color: green;
}
#bottom_middle1
{
width:360px;
height:30px;
border: 0px solid royalblue;
position:absolute;
_position:relative;
top:346px;
+top:203px;
+bottom:0px;
}
.right1 {
float: left;
width: 227px;
height: 420px;
margin: 0 3px 5px 0;
padding:10px;
border: 1px solid royalblue;
}
#titre1_right1 {
background: url('../../images/tab/tab_bleu_20px.jpg');
left: -10px;
position: relative;
top: -10px;
width: 248px;
height: 20px;
border: 0px solid royalblue;
font-size: 15px;
font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
font-weight: bold;
color: white;
}
#photo1_right1 {
position: relative;
right: 0px;
top: 17px;
width: 230px;
height: 323px;
border: 0px solid royalblue;
}
.thumbs img{position:relative;padding:1px;margin:5px 8px 5px 9px;border:2px solid #631e19;background:none;}
.thumbs img:hover{border:2px solid #c5c5c5; background:none;}
#sideleft{
BACKGROUND: #fff; FLOAT: left; OVERFLOW: hidden; WIDTH: 73%; padding-left: 10px;
TEXT-ALIGN: left;
BORDER: 1px solid royalblue;
}
#sideright{
FLOAT: right; WIDTH: 24%; TEXT-ALIGN: left;padding-right: 10px;
BORDER: 1px solid black;
}
/* -----------------
#sideleft{
MARGIN-BOTTOM: -32767px! important;
PADDING-BOTTOM: 32767px! important;
}
#sideright{
MARGIN-BOTTOM: -32767px! important;
PADDING-BOTTOM: 32767px! important;
}
---------------------*/
/* ----------------- Bottom content -------------------------------------------------------*/
/*#footer {
clear: both;
text-align:center;
line-height: 1.8em;
color: #444;
background: #fff;
padding: 0px 0;
margin:10px 0 0 0;
position: relative;
}*/
#footer a {color: #631e19; background: inherit;}
/* ----------------- Partners Marquee content -------------------------------------------------------*/
#partnersmarquee {
background: #FFF;
overflow:hidden;
height: 290px;
text-align: center;
left:0px;
width: 214px;
position:relative;
}
#partnersmarquee img {
border: 3px solid #F2F2F2;
display: block;
margin-top:50px;
margin-bottom:10px;
}
a picture comparing default page dispay in IE and FF is attached
Please give me your sugestions
Thanks in advance