Back Home

Open Designs

Community. Driven.

General Talk: Multiple Forms

Bottom of Page

1 to 10 of 10

  1.  
    •  
      CommentAuthorcoll23
    • CommentTimeApr 4th 2007
     
    How does one style multiple forms in a website? Is this possible or do I have to link a seperate style sheet for each form?
  2.  
    Just give it a class, or an ID, and style it from that, e.g.

    <!-- HTML -->

    <form action="contact.php" class="contact" method="get">


    </form>

    <form action="order.php" class="order" method="post">


    </form>

    <!-- / HTML -->


    /* CSS */

    form.contact {
    width:700px;
    }
    form.contact input {
    border:8px solid #444;
    }

    form.order {
    width:200px;
    }
    form.order input {
    border:2px solid #444;
    }


    /* / CSS */

    Etc. Does that help at all?
    •  
      CommentAuthorcoll23
    • CommentTimeApr 4th 2007 edited by coll23 on the 04th April 2007 at 11:30:24 EDT
     
    Thanks Christopher, yes I think that helps...I'm not using PHP though....for example I have a basic form for the user to make comments on a blog, but i have another form(s) for people to login and join before they can post comments. could i style this like so:

    form.comment{
    }

    label.comment {

    }

    input.comment {

    }

    textarea.comment {
    }

    <form action="get" class="comment" method="post">
    </form>

    -----------------------------------
    form.join{
    }

    label.join {
    }

    input.join {
    }

    textarea.join {
    }

    <form action="get" class="join" method="post">
    </form>
    •  
      CommentAuthormarkwest
    • CommentTimeApr 4th 2007 edited by markwest on the 04th April 2007 at 11:39:08 EDT
     
    PHP isn't relevant - that was just an example of the form action. The css that christopher posted allows for styling of controls within a form.

    e.g. you have a form

    <form class="comment" action="....">
    <label>...</label>
    <input .... />
    etc.
    </form>

    the css to style this will be

    form.comment {
    /* this styles the comment form */
    ....
    }
    form.comment label {
    /* this styles labels within the comment form */
    ....
    }
    form.comment input {
    /* this styles inputs within the comment form */
    ....
    }

    Repeat this for each form. Hopefully the commented css explains things a bit more.

    -Mark
    •  
      CommentAuthorcoll23
    • CommentTimeApr 4th 2007 edited by coll23 on the 04th April 2007 at 16:20:30 EDT
     
    That is real swell, thanks Mark and Chris!

    * did I mention I hate styling forms? *
  6.  
    wait... how do you process forms without PHP?
    •  
      CommentAuthorChristopher
    • CommentTimeApr 4th 2007 edited by Christopher on the 04th April 2007 at 16:59:19 EDT
     
    with coldfusion? javascript? asp? perl? python? ruby? with any number of other scripting languages? broaden your mind, PHP isn't the only scripting language available wink

    p.s. Glad you got it working Coll!
    •  
      CommentAuthorcoll23
    • CommentTimeApr 4th 2007
     
    cheers Chris!
  9.  
    hmm... wow, I'm surprised I didn't know that. Thanks Christopher for the insight.
    •  
      CommentAuthorarwen54
    • CommentTimeApr 5th 2007 edited by arwen54 on the 05th April 2007 at 23:54:36 EDT
     
    so many programming languages, so little time...

1 to 10 of 10

  1.