Centering form with CSS

Discussion in 'CSS' started by ColorWP.com, Nov 21, 2007.

  1. #1
    I am experiensing some trouble with CSS in my proxy site:
    http://casinohits.info/
    The URL form is not centered in Firefox (it is in IE though).
    The actual form was included with a remote iframe before, spanned by the DIV tag with class name "embed-container" (CSS file). Now I wanted to include the form with it's real HTML code instead of iframe include, but as you see the centering error in FF occured. Any way to fix this? I already tryed to include the form code into separate HTML code and include it with Iframe again, and it works fine, but that's not what I want.
     
    ColorWP.com, Nov 21, 2007 IP
  2. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #2
    div align="center" prolly screwing you up. it's not valid but you're teling FF (and everyone else) that this is xhtml trans.
    Also, not a good form. Forms need al this BS inside whether you use it or not to be vaid.

    
    <form class="embed-container" method="get" name="prf" action="http://proxy.org/proxy.pl">
    <fieldset>
    <legend><span>Enter Your URL</span><legend>
      <input type="hidden" name="proxy" value="random" />
      <label for="url">Enter a URL to visit via proxy:</label>
        <input type="text" name="url" id="ur" /> 
        <input type="submit" value="GO" />
    <p>Powered by <a href="http://proxy.org/">Proxy.org</a></p>
    </form>
    
    Code (markup):
    The css needs to style everything. Forms have fieldsets, and legends are required when there are fieldsets (not easy to style so people set spans inside legends and usually divs around fieldsets and set the fieldsets in the CSS to border: none. Inputs need labels and labels need the "for" to link them with the input. Inputs are also usually expected to have ids. Anyway, I would do it like this and center it with margin: 10px auto; (forms are blocks so they can be centered this way).
     
    Stomme poes, Nov 21, 2007 IP