Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4

Thread: CSS precedence

  1. #1
    Regular Coder
    Join Date
    Sep 2011
    Posts
    264
    Thanks
    49
    Thanked 1 Time in 1 Post

    CSS precedence

    Hi. On this page, there is a form at the bottom of the page.

    This is a Jotform.com form, which I embedded in the webpage in the form of a script, which produces an iframe.

    This is a Magento Go website, and in Magento Go admin, I have added custom CSS:

    Code:
    iframe#40142457787864 .form-all {margin: 0;}
    On the front end, this CSS is part of the file:
    http://eng513ed6aa4945b.img.mygostor...a6ac.css?r=129

    I want to left-align the form, instead of centre it.

    However, the iframe contains CSS:
    Code:
    .form-all {
    margin: 0px auto;}
    which is what I want to override.

    What do I need to do to my custom CSS in Magento Go, to take precedence over the iframe's CSS?

    Thanks.

  • #2
    Regular Coder COBOLdinosaur's Avatar
    Join Date
    Jul 2002
    Location
    Canada
    Posts
    369
    Thanks
    2
    Thanked 26 Times in 26 Posts
    If the form has an id you could us that and it should override the class. If not then you will have to modify the script to change the margin by using an inline style.
    100% standards compliant code is 100% correct 100% of the time.
    one of my toys from my repository and perhaps some help getting help

    Cd&

  • #3
    Regular Coder
    Join Date
    Sep 2011
    Posts
    264
    Thanks
    49
    Thanked 1 Time in 1 Post
    Thanks COBOLdinosaur.

    I now have the following CSS:

    Code:
    iframe#40142457787864 form#40142457787864 .form-all {margin: 0 !important;}
    iframe#40142457787864 form#40142457787864 .form-line {padding: 4px 0 !important;}
    but the browser is not applying this CSS to the form.
    Last edited by SRD75; 01-17-2014 at 12:17 PM.

  • #4
    Regular Coder
    Join Date
    Sep 2011
    Posts
    264
    Thanks
    49
    Thanked 1 Time in 1 Post
    I don't think the browser will apply a page's CSS to an iframe's content.

    I had a fiddle with Jotform and worked out how to add some custom CSS, which solved the problem.

    Thanks for your help COBOLdinosaur.


  •  

    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
    •