cross browser compatibility

[dingleberry]

Hi,

Curious if anyone has had problems with form elements (input boxes and text areas specifically) not maintaining the same size between browsers. More specifically, I've got a layout I created in fireworks. Sliced it up, and exported to dreamweaver. I then inserted form elements into new .html file. Anyone who has done this before probably has experienced frustration because if you insert a form element into a fireworks generated table, the size of the elements shifts the rest of the cells which then shifts the images those cells contain.

It ends up looking like a mess. So I created a layer. A layer should float on top of the .html file. You can then insert form elements into that layer and regardless of size, the native .html file maintains cell integrity.

This worked great until I tested it on a mac. Using a mac, it almost seemed like the layers were not being recognized in the browser. Using Internet explorer emulator on mac, no go. Using native mac browser or any other browser in mac environment, (OSX) no go. Using internet explorer on windows, perfect. Using netscape nav 7.3 perfect in windows. Just on macs are the problems arrising. Any insight would be really appreciated.

Thanks!
Dan

 

[lebisol]

Hi Dingleberry!

"A layer should float on top of the .html file"
NO, layer IS part of the HTML code/file and it can be placed on the top of the table or any other desing/html object.
Form elements do differ in look in IE and Mozillas....so u would design your FW table (hm hm hm pui) a bit 'bigger'....DW (unlinke FW) does allow u to add your own Browsers - "preview in Borwsers", so u can see the output quickly....
another way is using CSS to decorate your form elements...u can use Brower and OS detection to re-drirect user to another page or to attach differnt CSS...so u make a few CSS files and the one that is "decent" looking for each browser....
"cross-broswer issues= happy mendium", in reality they will never look 100% the same...unless u have a plain page.
take a look at the "login" form/table at :

http://mostarnet.com/template.asp

to see some small use of CSS ( NN side is not covered yet but u should get the hint)

about layers: look arround for some old posts, ther are tweaks on how to position layers in respect to table. Look into both DW and UD forums.
Good Luck!

> need more info?
:: don't click HERE ::

 

[dingleberry]

You know I did use css elements to reshape the form elements. Will css recognize different browsers and if so what might I do differently than what i have pasted below.

Thanks!
Dan
INPUT, TEXTAREA, SELECT, OPTION {
font-family: Arial, Helvetica, sans-serif;
padding: 2px;
font-size: 9px;
color: #333333;
background-color: #CCCCCC;
border: inset 1px #708090;
letter-spacing: normal;
text-align: left;
word-spacing: normal;
cursor: auto;
vertical-align: top;
overflow: hidden;


}

 

[lebisol]

no easy way out:

http://hyperdisc.unitec.ac.nz/resources/resources/CSSbrowserCompatibility.htm

> need more info?
:: don't click HERE ::