147 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Sells items exclusively on Envato Market
PaulVictor says

Hi all,

I’m working on a theme with my partner who does the coding but he works on a Mac (which shouldn’t be a problem). I work on a PC and I’m responsible for the graphic design. The problem is, all contact forms and input fields look totally different when I’m viewing the page which is online right now, we both use the latest versions of Firefox and IE. My partner claims it’s a problem with PC and Mac but he doesn’t know how to solve it. Could anybody here please help, the communication takes way too long because of this problem.

Here’s a screenshot of both: http://img59.imageshack.us/img59/2633/compai.jpg

2468 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has referred 100+ members
  • Has been a beta tester for an Envato feature
+2 more
digitalimpact says

Without having a page to firebug it’s quite difficult to tell. Are you perhaps using inline-block on form labels?

If you can provide a live URL I ’d be happy to take a look :)

147 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Sells items exclusively on Envato Market
PaulVictor says

This is the page but please keep in mind, it’s still work in progress: http://www.infictus.com/page/2/

2383 posts Bird is the word..
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $500,000+ on Envato Market
  • Has been part of the Envato Community for over 7 years
+8 more
jonathan01 says

Welcome to the world of cross browser inconsistencies :)

You need to reset all form elements first in your css for all browsers – then use CSS to style – you may need to have a separate css style sheet for different IE browsers as they never like to play along nicely via a conditional statement in the top of your html page.

That looks like the initial issue anyways.

2468 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has referred 100+ members
  • Has been a beta tester for an Envato feature
+2 more
digitalimpact says

Ok, I don’t have a mac, so I’ll tell you what I changed for Firefox on Win.

  1. in c_style.css, remove line 94
  2. Next, add these to label on line 62 of the same file: float:left; and width:67px;
  3. Then, on line 124, change what you have to this: margin-left:4px; width:270px;

It will now look, for Firefox Win, ~ like in your mac screenshot.

You’ll need to test it on the mac though…

@Jonathan – I see his stylesheet is using a reset :)

99 posts
  • Has been part of the Envato Community for over 5 years
  • Has referred 10+ members
  • Has sold $1,000+ on Envato Market
  • Located in Belgium
+2 more
krike says

There is no css on line 94, anyway I got it working :) thanks for your help

2468 posts
  • Has been part of the Envato Community for over 5 years
  • Has sold $100+ on Envato Market
  • Has referred 100+ members
  • Has been a beta tester for an Envato feature
+2 more
digitalimpact says
There is no css on line 94, anyway I got it working :) thanks for your help

There was when I looked at it :)

Glad you got it working.

Helpful Information

  • Please read our community guidelines. Self promotion and discussion of piracy is not allowed.
  • Open a support ticket if you would like specific help with your account, deposits or purchases.
  • Item Support by authors is optional and may vary. Please see the Support tab on each item page.

Most of all, enjoy your time here. Thank you for being a valued Envato community member.

Post Reply

Format your entry with some basic HTML. Read the Full Details, or here is a refresher:

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody

:grin: :shocked: :cry: Complete List of Smiley Codes

by
by
by
by
by
by