Not rendering as expected in Opera 7.0...

opera

[belena]

I have recently started being concerned about browser compatibility. Up to now my target browser has been MSIE 5.5 and it has been somehow forginving. Now its also Opera...and like Opera...I think it makes difficult to be lazy and write non compliant code, and that is good...but also challenging.

I have this class that work so well in IE but not well at all in Opera 7.0. I have looked around and so far I cannot see what is going wrong

table.newobj{
background-color: #FFFFFF;
border: 1px #999999 solid;
}

And this how I apply it:

<div align="center">
<form action="attendee" method="post">
<table id="newattendee" class="newObj" cellpadding="4" cellspacing="0" style="visibility: hidden; display: none">
<tr >

<th >Name</th>
<td><select name="Att list">
<option value="1>A</option>
</select></td>
</tr>
<tr >
<td colspan="2" align="right">
<input type="submit" value="Create " class="thin">
<input name="button" type="button" class="thin" onClick="hide('newattendee')" value="Cancel">
</td>
</tr>
</table>
</form>
</div>

Any one can see whatever it is that I cannot see? That would be very useful.
Thanks guys for your time.

Belen

[pageoneresults]

Hello belena, Welcome to WebmasterWorld!

Okay, so this is your class...

table.newobj{
background-color: #FFFFFF;
border: 1px #999999 solid;
}

And this is how you applied it...

<div align="center">
<form action="attendee" method="post">
<table id="newattendee" class="newObj" cellpadding="4" cellspacing="0" style="visibility: hidden; display: none">
<tr>

You've got an id on that table, what function is that serving? Also, your class name in the table does not match the class name in your CSS. You should be using all lower case, try switching the O to o.

Now, can you explain to us what the problem is? Before you do, make sure to validate your CSS so we know there are no errors there which may be causing other issues.

[DrDoc]

The border rule has it's attributes in the wrong order. Try this instead:

border: 1px solid #999999;

Combined with pageone's suggestion to make the class name the same as the one you're using in your style sheet (case sensitivity) will do the trick!

[belena]

Hey, thanks for that quick response.

The "newObj" vs. "newobj" is a typo in my first message...In my original code is fine.

I have validated my code here:

[jigsaw.w3.org...]

Its fine with it. It is "suggesting" to change #FFFFFF to #ffffff. It sounds irrelevant to me...anyway I have changed it to see if it made a difference and I still have the problem.

The idea with the code is that the table within the div is made visible and displayed by some javascript that works fine. I click on my button and the div with the table shows. All fine. Now, what I want is the table that I have just set to be displayed to have a white background and surrounded by a grey border, and this is not happening in Opera 7.11. (Works in IE5.5)

Have I explained myself better now? Hope so!
Thanks again,

Belen