dcsimg
www.webdeveloper.com
Results 1 to 7 of 7

Thread: Chrome Browser Hack not working

  1. #1
    Join Date
    Jun 2013
    Posts
    38

    Chrome Browser Hack not working

    Okay, so my site, http://www.cleantelligent.com,

    has a specifically styled form in the footer. I had to use inline styling to get all the fields to show up where I need them. In Firefox and IE, it looks fantastic and all lined up. But when I opened it in Chrome, all the fields are misplaced.

    I tried using the following browser hack:

    HTML Code:
    /*Chrome Fix*/
    @media screen and/*!*/ (-webkit-min-device-pixel-ratio:0) {
    
    .infusion-field-footer{
    	float: left;
    	padding-top: 5px;
    }
    .chromefix-fn{
    	position: relative;
    	left: -200px !important;
    	margin-top: 3px;
    }
    .chromefix-phone{
    	left: -6px !important;
    	position: relative !important;
    }
    }
    But it's still not affecting the styling in Chrome.

    Any ideas here? I can post any additional code you need upon request.

  2. #2
    Join Date
    Oct 2013
    Posts
    609
    Errors and missing tags don't help your cause.

    Validate your code

  3. #3
    Join Date
    Jun 2013
    Posts
    38
    Quote Originally Posted by Kevin2 View Post
    Errors and missing tags don't help your cause.

    Validate your code
    Code is validated. Thanks! What now? Still not working.

  4. #4
    Join Date
    Oct 2013
    Posts
    609
    Did you upload your changes??? Nothing has changed from what I see, including the validation. Hard refreshed several times to be sure.

  5. #5
    Join Date
    Jun 2013
    Posts
    38
    Quote Originally Posted by Kevin2 View Post
    Did you upload your changes??? Nothing has changed from what I see, including the validation. Hard refreshed several times to be sure.
    Ah! Sorry, I was an idiot and didn't sync my server. Check it again. Thanks!

  6. #6
    Join Date
    Feb 2014
    Location
    Canada
    Posts
    155
    I just checked out your website using Chrome, there were several errors and 1 warning of using a depreciated event.returnValue. On the other hand, the fields were mostly in line, just off bit a little bit. When I ran it in IE 11, the fields at the bottom were all over the place, some weren't fully visible but there were no errors.

    I notice that you're placing each input field separately, which I wouldn't do as it can result in some of them not being in line. Instead, I rely on tables to make sure my input fields and their names are in line. You can still have control over the width, padding, etc... . I would either put all the inputs in 1 table, with 2 of them in farther columns or use 2 separate tables. Afterward, it's just a matter of using <div>s to move the table(s) where you want them.

  7. #7
    Join Date
    Jun 2013
    Posts
    38
    This is a great and obvious idea... The issue is, I don't know if it will work with the contact form 7 plugin. I guess I'll have to try it and see. Thanks for the input! I'll let you know how it works.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles