Preserved Topic: CSS and Netscape

I created this order form and used css to make fields nice. Everything looks nice and peachy in Opera and IE but when I go to NC the fields are all messed up.

Is there a way around to this?

I used a style sheet that was posted somewhere here in Archives. It was actually from Asylum style. I modified it and I love the look but NC doesn't

:: m a x ::

It would be good if you could show use that page... Also, you didn't specify which version of NN?

Well I can't post it because it not published yet...

but here is the code..

<style>
.form { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; font-weight: normal; color: #000000; text-decoration: none; background-color: #ffffff; border: #999999; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
</style>

and then by each field I have:

<input type="text" name="whatever" size="30" class="form">

Everything looks nice in Opera and IE...like I said

The version is Netscape Navigator 4.79

Is there a some kind of a script I should put in there to fix it? I really don't want to create sepatrate page without this class and have users with Netscape redirected... ugghh



:: m a x ::

I think that your problem is that version of Netscape. It doesn't support any of your CSS except for the stuff that is for the fonts. The rest of that, border and background color etc. . . is not going to show up in NN4.7

I think that is what you mean. Or do you mean placement?

Just to let you know you can shorten the font code:

<style>
.form{font: normal 10px Verdana, Geneva, Arial, Helvetica, sans-serif;}
</style>

Also watch out my declaring the font "normal". If you want it to bold on mouseover or something, it isn't going to work in NN4.7 either. Just leave it blank.

Know what I mean?



Later,
C:\


~Binary is best~

NN4 and CSS is pain in the ass.
Said that you have not so many options, here is what I would do.

You can import one another style which would be completly ignored by NN4.

The syntax is:
<style type="text/css" media="screen">@import "css/advanced.css";</style>

In that style sheet you can add everything that NN4 has problems with, for example you form formating.
You are not gonna have the same effect as in the recent browsers but at least the page is not gonna break in NN4.

I bet the reason why it looks so bad in NN4 is also your "border" formating.
Try:
border-top: 1px, #999, solid;
border-left: 1px, #999, solid;
border-right: 1px, #999, solid;
border-bottom: 1px, #999, solid;

and delete the other ones.




Sasha.

Sash, that sounds like a good way of excluding older versions of Netscape... but do IEs (4+), Opera and NN6 understand it, or are some of them excluded, too?

kuckus

IE4 is excluded, as far as I know. It is a nice hack to exclude older browsers.

Opera 5 and 6, Mozilla and NN6 understand it.


Sasha.

I dont' get this sash...

I put what where? I mean, I don't mean to sound stupid or anything.. I played around with this but I am just getting my feet wet with CSS right now...

Can you tell me exactly what to put where?

The problem is not with the page but with the form fields alone...For example, I have menu field and with this style the menu is not drop down. Its just a big square with all the names in it..

Here is the screen shoot in IE
www.studiosone.com/IE.jpg

and here is Netscape
www.studiosone.com/NN.jpg


See what I mean? But when I take that style out it looks good in Netscape...

Netscape must die!!!


:: m a x ::

Ducati:

On the NN.jpg, are you using a drop down box for the State (Full Name)? Looks kind of weird. Or is that what you are talking about?

It would be real nice if the screen shots were of the same section of the page.

The styles around the input boxes you might as well forget about in NN4.7. If you look at the Address, City, etc. . . how the bold is on the IE shot but not the NN4.7. This is what I was refering to in the post above about setting the font to normal.

You are not going to get the form to look the same in IE and NN when you specify borders. NN doesn't like them.



Later,
C:\


~Binary is best~

I think I will just take those styles out and redirect to the right page..

StudiosOne is gone...

ALl of my links wont work


:: m a x ::

ok.. so should I code for NN 4 something or not???

I need to get this shit done and really don't fell like messing with it...

MAX

Ducati, I would create one style sheet for Netscape without those form borders and all the things it doesn't display correctly, and link to it like this:

<link rel="stylesheet" href="css/nn-styles.css" type="text/css" />

Put all the the other things that only the newer browser like into an own file and link to it the way Sash proposed:

<style type="text/css" media="screen">

   @import "css/advanced.css";

</style>

Or, if you don't want to support Netscape, only include a style sheet for the newer browsers with @import.

kuckus

in NN4.x (and even NN6.0 & 6.1), there is a problem with formatting form fields (height, width, etc..) so netscape prefers to use the size=xx attribute of the input tag.. not sure if this is what you're referring to, but this is something i've had trouble with in the past... my $0.02

"there has to be a solution."

But still.. when I take the style out, it still looks like shit in NN! God I hate that stupid browser!!!!!!!!!!

take a look how messed up it looks...
www.simplifiedesolutions.com

and go to order page and support...

My certificate is not active yet so you might get an "security issue" window...

<edit> ok... I fixed most of it but I still have problems with order page. I am simply redirecting to different folder. It works out good but there is still a little problem...

On order page everything is messed up. How can I fix this? I get this problem a lot and it would be good if someone explained to me why this happens and how I can fix this? </edit>

Thanks!

MAX

[This message has been edited by Ducati (edited 03-22-2002).]

[This message has been edited by Ducati (edited 03-22-2002).]