Form layout works in safari only

Hi there,

I am wondering if anyone can shed light as to why this form is working in safari but not Chrome and explorer…
http://devdottlccldotcodotnz/contact.php

Any help most appreciated (its the last hurdle!)

regards,
Daniel

Hi,

I’ve moved your question to the CSS forum due to the word “layout” in the title.

Could you please elaborate on what you mean by “not working”

Thanks for the reply

Could you please elaborate on what you mean by “not working”

Yes sorry nothing to do with functionality of the form, just how the html and css is not working in browsers other than Safari.
It ‘works’ fine as a design in Safari but not other browsers…

No probs :slight_smile:

But that’s my question. What does this actually mean?

It would be better to write something like: “The text at the bottom of the form is rendered on top of the button. I want it to be rendered before the button”

OK Pullo

So if you view it in Safari it is correct:

A brown container with form on the left and contact details on the right…

Other browsers are showing no brown container
form width isn’t wide enough
adress at the bottom overlapping send button

Ok, well there are a number of errors on your page which need addressing first.
You can see these when you run the page through the HTML validator.

If any of that output is unclear, just let me know.

Thanks Pullo,

I have gone in and made some of those updates
there is a few things in there that I can’t see as being wrong or grasp what should be corrected.
These are form related one like
Line 85, Column 29: No space between attributes.
<form class="well name=“form1” method=“post” action=“amt-contact-form.php”>

Line 85, Column 34: Quote " in attribute name. Probable cause: Matching quote missing somewhere earlier.
<form class="well name=“form1” method=“post” action=“amt-contact-form.php”>

Line 85, Column 79: Attribute form1" is not serializable as XML 1.0.
<form class="well name=“form1” method=“post” action=“amt-contact-form.php”>

Line 101, Column 108: Attribute m-hide" not allowed on element textarea at this point.
…hide" name=“Message” placeholder=“Message*” id=“textarea” rows=“8” ></textarea>

Thank you.

class=“well” name=“form1” for one thng.

<form class="well" name="form1" method="post" action="amt-contact-form.php">

       <label>
       <input name="name" class="input-width" placeholder="Name*" type="text" />
       </label>

        <label>
        <input name="telephone" class="input-width" placeholder="Telephone" type="text" />
        </label>

        <label>
        <input name="email" class="input-width" placeholder="Email*" type="text" />
        </label>


       <label>
       <textarea class="input-xlarge m-hide" name="Message" placeholder="Message*" id="textarea" rows="8"></textarea>
       </label>

        	
    <button type="submit" name="Submit" class="btn"></button>
    </form>

Thanks thats that done:
<form class=“well” name=“form1” method=“post” action=“amt-contact-form.php”>

still have visual issue!

Hi,

I’m still seeing a bunch of errors. Did you upload your changes?

You need to validate your markup. Your menu for example doesn’t have the closing > for the <a href

<li class="mobile-nav"><a href="#mobile-nav" title="Home"[COLOR="#FF0000"]>[/COLOR] Menu</a></li>

And that’s most likely what’s killing the layout …

Can this post please be removed as the web address is showing on google???

Unfortunately we do not delete posts on request and you should remember than anything you post on the web is there for all to see possibly for all time :slight_smile:

I have however obfuscated the link for you this time so it shouldn’t show in results but in the future you can do that for yourself when you post :wink:

am I able to delete myself as a user and if so will that make these posts disappear ?

No, that’s not possible, I’m afraid. The obfuscation that Paul did should fix things Google-wise, though. :slight_smile: (It just might take a little while for Google to update, but none of us has any control over that.)