FORM elements design using CSS and list (ul and dl) Tables are useful to design complex HTML forms but a good alternative is to use list elements and CSS.
After my last post (Clean and pure CSS FORM design) I receive a lot of messages with some suggests, opinions and critics about the method illustrated in these post to design a FORM using pure CSS code. I have to say I prefer to use table to place FORM elements into the page, but another method I often use is the following: using unordered list (<ul>). In this post I would show another way to design FORM using list elements <ul> and <li> (Jennifer also suggested to use <dl> tag). In any case, if you want to use pure CSS code instead of HTML table to design your FORM I think this is a good way to do it. Download source code Step 1: HTML Code HTML code is very simple. HTML code is: <legend>Sign-up Form</legend> <form name="signup"action="index.html"method="post"> <ul> <li><label for="name">Name</label> <input type="text" name="name" id="name" size="30" /> </li>
80 Beautiful Typefaces For Professional Design. Advertisement You don’t like to scroll?
Be prepared. (We warned you.) Every now and again designers stumble upon the very same problem: the choice of a unique and beautiful typeface which manages to fulfill three basic tasks. Support the corporate identity, enrich the visual appearance and is compatible with the overall design. So which typefaces are “bulletproof”? We have answers. Let’s take a look at over 80 gorgeous typefaces for professional design, based upon suggestions from designers and web-developers all over the world. Classic Typefaces Classics of typography in a brief overview. 1. 2. 3. 4. 5. 6. 7. 8. The Glossy TEXT web2.0 style « photoshopit. Remember – reading and doing is the best way to learn…anyways…Today I will be talking about and even giving some tips about the “way too famous” Glossy text EFFECT – something like this: over used on web2.0 logos…but how can it not be – it is just so NICE!
– I am sure you have all seen it out there – I also know that there are many more than one way to do this effect – that is one of the countless awesome things about photoshop. “To each his own”. NOw here is how this will work. I will give detailed explanations – along with one image of the whole process – and if that still dont work you are free to take the psd -and use it however you like. Anyone who is using a mac it is COMMAND instead of CTRL.
Here goes: 1. using the Type tool – write out the text that you want to glossify . Keep in mind that most of these text effects are very bad for running text but rather for titles, logos, headlines etc.. 2. While the “gloss” layer is selected. 3. Now go get the eliptical marquee tool. Free Layouts. CSS Gallery and Website Design Inspiration.