Avatar of passion420
passion420
 asked on

CSS Not rendering same in different browsers

Hello Experts
I have a CSS being used by different aspx pages. The page does not renders in same way on firefox and IE. The text appears to be cut. I was able to adjust the text but I am looking for more recommendations on this to adjust the behaviours for different browsers

div.header {
      cursor:pointer;
      height:22px;
      width:250px;
      background-position:0px 0;
      background-repeat:no-repeat;
}

div.contents.on div.header {
      background-position:0 -22px;
}

ul.navSection{
      display:block;
}


div.contents.on ul.navSection{
      display:block;
}


div.contents.on{
      display:block;
}




 P.basic-paragraph {
      TEXT-ALIGN: justify; FONT-VARIANT: normal; FONT-STYLE: normal; TEXT-INDENT: 0em; MARGIN: 0em; FONT-FAMILY: 'Arial'; COLOR: #000000; FONT-SIZE: 1em; FONT-WEIGHT: normal; TEXT-DECORATION: none; width:660px; overflow:hidden
      
}
 .lineDivider {
      BORDER-BOTTOM: #000000 1px solid; HEIGHT: 4px; BORDER-TOP: #000000 3px solid
}
 .dekCopy {
      TEXT-ALIGN: center; LINE-HEIGHT: 28px; TEXT-TRANSFORM: uppercase; FONT-STYLE: italic; MARGIN: 0px 0px 22px; FONT-FAMILY: Georgia; COLOR: #4b4b4b; FONT-SIZE: 20px; width:660px
}
.Description {
      TEXT-ALIGN: justify; LINE-HEIGHT: 18px; WIDTH: 660px; FONT-FAMILY: Arial; FONT-SIZE: 12px; overflow:hidden
}
 .Description-image-caption {
      FONT-FAMILY: Arial; COLOR: #898989; FONT-SIZE: 11px; PADDING-TOP: 8px; width:660px
}
 .History {
      FONT-STYLE: italic; COLOR: #898989; FONT-SIZE: 11px
}

.onLeftbar {
      TEXT-ALIGN: justify; TEXT-INDENT: 0em; WIDTH: 300px; PADDING-RIGHT: 20px; FONT: 1em/18px 'Arial'; FLOAT: left; COLOR: #000000; TEXT-DECORATION: none
}
.onRightbar {
      PADDING-LEFT: 0px; WIDTH: 333px; FLOAT: right
}
.heading-paragraph {
      TEXT-ALIGN: justify; FONT-VARIANT: normal; FONT-STYLE: normal; TEXT-INDENT: 0px; MARGIN: 0px; FONT-FAMILY: 'ITC Fenice Std'; COLOR: #000000; FONT-SIZE: 16pt; FONT-WEIGHT: normal; TEXT-DECORATION: none
}

 .HistoryDesc {
      COLOR: #949599
}
 .HistoryTitle {
      TEXT-TRANSFORM: uppercase; FONT-FAMILY: heading-paragraphs New Roman,serif; FONT-SIZE: 16px; FONT-WEIGHT: bold
}
 .addRight {
      POSITION: relative; WIDTH: 270px; FLOAT: left; LEFT: 120px
}
 .addLeft {
      POSITION: relative; WIDTH: 270px; FLOAT: left; LEFT: 60px
}

.onRightER {
      TEXT-ALIGN: justify; TEXT-INDENT: 0em; PADDING-LEFT: 34px; WIDTH: 280px; FONT: 1em/18px 'Arial'; FLOAT: left; COLOR: #000000; TEXT-DECORATION: none
}
.onLeftER {
      PADDING-LEFT: 0px; WIDTH: 336px; FLOAT: left
}

 .Stamp {
      TEXT-ALIGN: justify; FONT-VARIANT: normal; FONT-STYLE: normal; TEXT-INDENT: 0em; MARGIN: 0em; FONT-FAMILY: 'ITC Fenice Std'; COLOR: #000000; FONT-SIZE: 23pt; FONT-WEIGHT: normal; TEXT-DECORATION: none
}
 
Please suggest what other changes I can make to this CSS so it renders correctly in different browsers. The font appears little different in firefox and text appears to be cut on the page. I am also looking for other recommendation for any  imporovemtn which I might be lacking here. May be relative positioning or absolute positioning for DIV tab to adjust them?
CSSHTML

Avatar of undefined
Last Comment
passion420

8/22/2022 - Mon
ASKER CERTIFIED SOLUTION
LZ1

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
SOLUTION
Jen0910

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
passion420

ASKER
I am going to assign points to both of you. I adjusted the width and its working. For some reason I cannot post the HTML here and there is no live link to this site yet. But thanks for your time.
All of life is about relationships, and EE has made a viirtual community a real community. It lifts everyone's boat
William Peck