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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Nov 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Removing white space between image and form.

    Hi guys,

    I recently used jotform to create a form for a facebook tab. I then placed an image above it to customize it.

    However there is a white line between the form and image, is there any code I can get rid of to delete the gap?

    Thanks folks,

    Colin

    Code:
    <link type="text/css" rel="stylesheet" href="http://www.jotform.com/formstyle/3220708447.css?v=3.1.9"/>
    <link type="text/css" rel="stylesheet" href="http://www.jotform.com/css/styles/form.css?v3.1.9"/>
    <link href="http://www.jotform.com/css/calendarview.css?v3.1.9" rel="stylesheet" type="text/css" />
    <img style="text-align: center; margin: 0px auto 10px; width: 520px; display: block; height: 477px;" id="BLOGGER_PHOTO_ID_5539831220194735330" alt="" src="http://thinkhousepr.com/fbapps/clonakilty/imagery/formheader1.jpg"/>
    
    <script type="text/javascript">
        var Facebook = {
            get: function(id) {
                return document.getElementById(id);
            },
            map: function(array, block) {
                results = [];
                for (var i = 0, l = array.length; i < l; i++) {
                    results.push(block(array[i]));
                }
                return results;
            },
            domCollect: function(element, matcher) {
                var $this = this,
                collection = [];
                var recurse = function(subelement) {
                    var nodes = subelement.getChildNodes();
                    $this.map(nodes,
                    function(node) {
                        if (matcher(node)) {
                            collection.push(node);
                        }
                        if (node.getFirstChild()) {
                            recurse(node);
                        }
                    });
                };
                recurse(element);
                return collection;
            },
            getByName: function(elementName) {
                var matcher = function(element) {
                    return (element.getName() === elementName);
                };
                return this.domCollect(document.getRootElement(), matcher);
            },
            alert: function(msg, title) {
                new Dialog().showMessage(title, msg);
            },
            error: function(msg, liid) {
                this.get('id_' + liid).setStyle('backgroundColor', '#FFAAAA');
                this.alert(msg, "Error");
                return false;
            },
            validateEmail: function(lid) {
                var tvalue = this.get('input_' + lid).getValue();
                var email = /[a-z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+\/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])/i;
                return tvalue.match(email);
            },
            checkElement: function(temp, etype, ename) {
                var templid = temp.split("_");
                var lid = templid[1];
                var tel = this.get(temp);
                var error = false;
                switch (etype) {
                case "dropdown":
                    error = this.get(temp).getSelectedIndex() === 0;
                    break;
                case "textarea":
                case "fileupload":
                    error = this.get(temp).getValue().length < 1;
                    break;
                case "email":
                case "textbox":
                    if (this.get(temp).getValue().length < 1) {
                        error = true;
                    } else {
                        if (this.get(temp).getClassName().indexOf('validate') != -1 && this.get(temp).getClassName().indexOf('Email') != -1) {
                            if (!this.validateEmail(lid)) {
                                error = "Please enter a valid email address";
                            }
                        }
                    }
                    break;
                case "radio":
                case "checkbox":
                    tel = this.get(temp + "_0");
                    var elt = this.getByName(tel.getName());
                    var ll = 0;
                    if (elt.length == 1) {
                        if (elt[0].getChecked() === false) {
                            error = true;
                        }
                    } else {
                        ll = elt.length;
                        var chk = false;
                        for (j = 0; j < ll; j++) {
                            if (elt[j].getChecked() === true) {
                                chk = true;
                                break;
                            }
                        }
                        if (chk === false) {
                            error = true;
                        }
                    }
                    break;
                }
                if (error !== false) {
                    this.error(((error === true) ? ename + ' is required': error), lid);
                    return false;
                } else {
                    this.get('id_' + lid).setStyle('backgroundColor', 'transparent');
                    return true;
                }
            },
            checkForm: function() {
                var tempo = this.get('reqids').getValue().split(",");
                for (var i = 0; i < tempo.length; i++) {
                    var mixedel = tempo[i].split("*");
                    if (this.checkElement(mixedel[0], mixedel[1], mixedel[2]) === false) {
                        return false;
                    }
                }
                return true;
            }
        };
    </script>
    <form class="jotform-form" onsubmit="return Facebook.checkForm();" action="http://www.jotform.com/submit.php" method="post" enctype="multipart/form-data" name="form_3220708447" id="3220708447" accept-charset="utf-8">
        <input type="hidden" name="formID" value="3220708447" />
        <input type="hidden" id="reqids" name="requireds" value="">
        <div class="form-all">
            <ul class="form-section">
                <li class="form-line" id="id_3">
                    <label class="form-label-left" id="label_3" for="input_3"> Full Name </label>
                    <div id="cid_3" class="form-input"><span class="form-sub-label-container"><input class="form-textbox" type="text" size="10" name="q3_fullName3[first]" id="first_3" />
                            <label class="form-sub-label" for="first_3" id="sublabel_first"> First Name </label></span><span class="form-sub-label-container"><input class="form-textbox" type="text" size="15" name="q3_fullName3[last]" id="last_3" />
                            <label class="form-sub-label" for="last_3" id="sublabel_last"> Last Name </label></span>
                    </div>
                </li>
                <li class="form-line" id="id_4">
                    <label class="form-label-left" id="label_4" for="input_4"> E-mail </label>
                    <div id="cid_4" class="form-input">
                        <input type="text" class="form-textbox validate[Email]" id="input_4" name="q4_email4" size="30" />
                    </div>
                </li>
                <li class="form-line" id="id_5">
                    <label class="form-label-left" id="label_5" for="input_5"> Upload CV </label>
                    <div id="cid_5" class="form-input">
                        <input class="form-upload" type="file" name="q5_uploadCv" id="input_5" accept="pdf, doc, docx, xls, csv, txt, rtf, html, zip, mp3, wma, mpg, flv, avi, jpg, jpeg, png, gif" maxsize="500" />
                    </div>
                </li>
                <li class="form-line" id="id_6">
                    <label class="form-label-left" id="label_6" for="input_6"> Upload Recipes </label>
                    <div id="cid_6" class="form-input">
                        <input class="form-upload" type="file" name="q6_uploadRecipes" id="input_6" accept="pdf, doc, docx, xls, csv, txt, rtf, html, zip, mp3, wma, mpg, flv, avi, jpg, jpeg, png, gif" maxsize="500" />
                    </div>
                </li>
                <li class="form-line" id="id_2">
                    <div id="cid_2" class="form-input-wide">
                        <div style="margin-left:156px" class="form-buttons-wrapper">
                            <input id="input_2" type="submit" value="Submit Form" class="form-submit-button">
                        </div>
                    </div>
                </li>
                <li style="display:none">
                    Should be Empty:
                    <input type="text" name="website" value="" />
                </li>
            </ul>
        </div>
        <input type="hidden" id="simple_spc" name="simple_spc" value="3220708447" />
        <script>
            document.getElementById("si" + "mple" + "_spc").setValue("3220708447-3220708447");
        </script>
    </form>

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,853
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Hard to tell without seeing a live page.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Nov 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    My bad. Check out the tab here.

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,853
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Code:
    <img style="text-align: center; margin: 0px auto 10px; width: 520px; display: block; height: 477px;" id="BLOGGER_PHOTO_ID_5539831220194735330" alt="" src="http://thinkhousepr.com/fbapps/clonakilty/imagery/formheader1.jpg"/>
    There's a 10px bottom margin applied on that image.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    New to the CF scene
    Join Date
    Nov 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    perfect. thanks!


  •  

    Posting Permissions

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