Hi guys, I'm new at this forum. I need some help. So I'm trying to create online application for tournament, something like this.

 

http://prntscr.com/47t3gg

 

But I dont know how to create it, and make it nice looking as this one on image. If someone know how to do it, please reply

bump

http://jsfiddle.net/cjrt2/4/

To make it work from scratch is a little bit above me (so maybe someone else can help you out with that) but if you were using a CMS like wordpress, you could download a plugin and get it to do exactly what you're looking for, as well as skin it using some simple CSS to get the result you are after.

 

ContactForm7 for wordpress is a good starting point I think.

Thank you guys, I'll try ContactForm7. But I need the design that is the most important for my page.

I'd go with a CMS with a forms component too, otherwise you're going to have to handle the front end and database development yourself, and probably end up with an insecure solution that is wide open to being hacked.

But still, I can't edit layout (design) of form that is made in Contact Forms 7.

Are you sure? I've edited a form on my site using CF7.

 

In my case, I've got the form loaded into a div with the ID of #contact-form.

 

 

#contact-form input{width:100%; border-radius:2em; border: 1px solid #000;}

 

The code above will alter the entry fields to taste. All you'll need to do is change the rest of the css following that. And as far as I'm aware, CF7 has some very raw field editing tools. And by that I mean, they just let you put in HTML into a box and you can call it with a shortcode.

 

Believe me, editing the design is rather simple. You can also change individual entry fields with classes and IDs to get a truly customised look. Take a look at my rather plain contact form using CF7 here: http://www.williamsgraphics.co.uk/contact-us/