I'm still relatively new to CSS, but after a lot of reading, I figured out how to add “headers” to the panel. I will go. But the problem that I am facing is that one of my panels, in particular, will not display correctly in Firefox. I do all the development in Chrome, and now I noticed this problem. The weird part: I can add my “title” (maybe it is better to call it a wrapper div?) To other panels, and they look great - this is just 1 panel that gives me problems that I can’t understand Why. To understand what I mean, see http://www.mobiuspc.comin Firefox and Chrome. The difficult panel in question is the name "Area Construction Area" - the teal color border in Firefox is the spray itself everywhere, while in Chrome it displays correctly.
Here is the CSS for the complex panel:
.dropareaparent
{
height:528px;
width:690px;
margin-left:332px;
margin-top:-540px;
background-color:teal;
text-align:center;
color:White;
}
.droparea
{
height:500px;
width:680px;
margin-left:2px;
padding:3px;
color:Black;
background-color:White;
text-align:left;
float:left;
}
Here is the CSS for another panel that works fine in both browsers:
.primarystatdivparent
{
height:428px;
width:266px;
margin-top:-530px;
margin-left:1045px;
background-color:teal;
text-align:center;
color:White;
}
.primarystatdiv
{
height:400px;
width:256px;
margin-left:2px;
padding:3px;
color:Black;
background-color:White;
text-align:left;
}
Besides my absolute positioning (still learning how to swim things), does the CSS between the problem panel and the ideal panel seem the same to me?
For reference, IE looks great (except for slow Javascript execution).
source
share