Styling a Simple Form with CSS in Dreamweaver

[snuggerzoid]

LOL.... dont second guess me ;)

[Isedonxt]

Thanks!

[KeenuoYusuf]

Good job man. Great Vid!

[12TabulaRasa12]

Thank you for the interactive lesson! Makes dreamweaver more comprehensive :)

[xR1D1xful]

Hey everybody I just finished designing my website but I don't no what to call it! Can someone help me its for helping young graphic designers although I could use some help myself right now.

Please send me a message if you even bother helping me

Thank you!

[joeygart]

Wow That looks like a better form when you used CSS in dream weaver.

[timvideo1000]

I really like it. Thanks? for uploading.

[lorenzom21]

Why did your form buttons suddenly line up when you styled them?

[Brick1411]

lol jk nice vid

[Brick1411]

╭∩╮（︶︿︶）╭∩╮

[MrYaya1111]

Great job

[JDOG13596]

21:13 - I Think That Everyone Agrees With That Statement!

[locoplanet]

How do you get the form to send the information when the fields are filled in?

[beinyourguard]

tutvid is the best tutorial channel ever.

[emmy009]

also i use macromedia dreamweaver 8,i wanna know is it possible to create standard images like your header(barner) and so on with dreamweaver or i gata do that in another program like photoshop etc.pls nat, i await your reply.. thanks again.

[emmy009]

but i gat a problem using tables, that's the normal tables, am made to understand that i can also use css to design a webpage but i tried looking for such videos here and couldn't get what exactly i was looking for, i was wondering if u could teach me that by doing a video for me, or even teach me how to use tables to design a table ,

[emmy009]

hey nathaniel,am mimshach from Nigeria and i really love yr videos , i have really learnt alot from you. i wanna say thank you.i gat this littlle challenge,Ok. i can fairly design a webite now thanks to you and some other guys here on youtube...

[Carlioslasaurus]

You are a wonderful instructor, thank you.

[TinchoNa95]

Hey! thanks for this great tutorial, but I had a problem how can I do to put my email in the css, so the people who wants to send me a messenge I could read it on my email home page. Thanks

[C0LEMAN777]

Hey thanks for the tut, believe it or not i came to this video with no knowledge of CSS and you gave me some basics thanks

[cheatonly2win]

Could have been better.

[GAMESGLORIOUSGAMES]

ie angers me sooooo much... my form does not display properly

[silentpro105]

Hey man, do u ever use firebug?  The CSS changes translate really cool for beginners over videos like these...

[ahmedshaie]

tutvid, i wanted to ask, can you do a video tutoiral on a twitter style status box, with counters and rollover effects, i've tried to do it, but keep stuffing it up, or ending up without a clue, i have sent you a message before, but u haven't replied yet

[Techible]

conTEXT is a good text editor i use for editing code on my Windows Vista

[imegglobal]

Hi there- Your videos are so helpful! But I am having a problem with my contact form. My comments field is not in block format. The word "Comments" appears next to the E-mail input field and the Comments text box is on the next line. Any idea where I went wrong? Thank you for all your help.

[lekofev]

Thank You so much Nathaniel, a'm learning a lot with your videotutorial, this code is a little hard, but i will try understand everycode^^, thank man, keep helping to world ^^,

Greetings from peru ^^, Sorry for my bad English

[graphicsite]

This is so great and very helpful. Thanks a lot.

Christa

[DrJams]

Don't forget to use the accesskey Attribute in your forms. I love sites that use them. (so I can be lazy)

[CompGuy911]

Thanks, i am going to put da on my site

- Joseph/CompGuy

[scientist100]

even though the browser is smart enough to know that input is recognized as textbox, it's a better idea to use type to be specific, just some things, to keep in mind, maybe you just forgot to point that out.

- J.

[fredv1]

Dreamweaver is for noobs

[scientist100]

@fredv1 not really, I use it for coding, 'not for design' but still is very helpful, when using any other program you sometimes misspell some words giving you headache, by the way I started using Programmer's Notepad, google it, it's great program. Handles php and many other languages, highlight etc ;)

[JohnnyRock2000]

@fredv1 As you have said, if Dreamweaver is for noobs, what do you suggest? Experience is a teacher. Can you enlighten us at all. We are not geniuses here. Just looking for help in a complex display technology.

[romanticblade]

@fredv1 it is true that to learn coding its better to use plain text editor, but when you get to difficult codes, it starts getting hard to orientate around. thats why Dremweaver is irreplaceable when actually managing the web site. you can directly upload the files to ftp and is great when ure not the only one working on it.

[brownpauls]

Thanks for this tutorial. This is just the tutorial I needed to get me over the edge. For some reason CSS has always been challenging and its now starting to come together.

[shakaama]

hey what you think of aptana studio?

I went to your website, the videos are so crystal clear on there. I didn't realize how bad youtube is.

Thank you for this tut btw.

[cmoivalou]

Nice tuto.

[davidknag]

and how do i make it so that i can make it a form for my website. I did all of this thinking that you would give a code to make it send and now im frustrated. I just did like an hour of typing for nothing!

[Theben0987]

@davidknag If you go to his website, he has a tutorial on how to send it via php. :) if not, just good, how to send mail via php.

[Seryosin]

@davidknag You need to use a php. This tutorial shows only how to make the visual part of contact form.

[DeeJayTimo]

@davidknag You did this for learning, you didn't do it for creating a whole website. Check his other tutorials, this is "Styling a Form with CSS" not "Creating a form for my website."

[alexandarTV]

@davidknag he said styling not formating.

[BeansCanTalk]

@davidknag He said he was just focusing on the form style and not the PHP 2:20

[TheBlakeWilliamson]

@davidknag look up phpacedemy. that's all php your talking about. this is css. lol

[iworksgroup]

Which recording program do you use?

[BmoreGraphic]

I filled out the html in note pad. When I viewed it in firefox there was a comment box but no boxes for "name" or "email" nor were there any buttons. I then tried to do it in dream weaver... the same thing keeps happening. i keep pausing the video to double check my code... and yet nothing is different. Why is this happening?

[PrinceProStudio]

Hi, Can you make a tut on how to make a Dark Styled Gaming Website?

[mtbrain1]

waaay to fast... i cant follow along...

[sunioj101]

well I got the email to show, but now the Backgrounds not showing.

style type="text/css">

body (background:url('bj.jpg'); margin:0; padding:0;)

/style>

[sunioj101]

I need some quick help, I'm doing this in notepad and I've followed it to the T.

I'm upto around 5:40.

for this bit.. for="email">Email:

Name and Comments show, but email is invisible or doesn't show on the actual web page. There is no difference between name or comments to the email, but it still don't work

[cryspypotato]

Ha ha- funny thing is the CSS still did not work correctly in Internet explorer-for me at least, Firefox, Chrome, Opera all did great. I'm starting to get annoyed by IE, 90% of the time things end up looking wrong on it, and you end up spending 2h on a separate style sheet for IE. :( Great tutorial BTW-thank you!

[jamesrdolan]

Awesome tutorial but how do I make it send to a certain email address? I was hoping the tutorial would show that. Cheers TutVid!

[dwagothegod]

Hey Nathan, will you buy the new CS5 that has come out? Would be cool if you did tutorials on them to ^^. Not much has changed in the programs but there are some functions that are awesome.

[flamemon11]

can you make a video on how to make a website with css using dreamweaver cs4 plz and thank you

[skjlab]

is not Safari pickier then Explorer?

[macjsus]

I wish the HTML wasnt yellow, you should change it to green or orange or something that contrast better against white.

[evildwarf]

This is exactly what I needed! Thank you!!

[thetechall]

cool. but i really reccomend you have your css on a seperate style sheet

[karrotsrkool]

@thetechall i think it was put in the HTML file to try and speed up the tutorial

[nelsyeung]

Another really nice tut, but do you really need to do 0 auto 0 auto, you can just do 0 auto can't you, because 0 will represent both top and bottom and auto will represent both left and right?

[Skelly85]

The yellow font is hard to see.

[tutvid]

@Skelly85 I'll take a look at changing or darkening the yellow to make it a little easier. Thanks for the heads up!

N.

[Skelly85]

@tutvid not a problem, Your vids have really helped me when I started out in dreamweaver.

[neoc03]

This was an amazing tutorial!!! Thank you

[StureLarsson]

Great job Nate! Only thing I noticed was really annoying was the yellow text. Didn't really make it easier. Just a small note there. Anyways, I love your tutorials! You inspire me to make my own! Thank you!

[StureLarsson]

@StureLarsson I realized that it was my computer screen... -.- Dragged the video over to the right one and I looked alright. :)

[NikkexD]

I don't see why you are using images? The only, yes, only image you need is the background. The border of the wrappper can be made by using a border and outline, and the inner gradient can be done with CSS3, and as it's barely even visible, i don't think a IE6 user would take sucide if he didn't see it.

[NikkexD]

@NikkexD also, with the new HTML5 you don't need to set the type of either style or script tags. Style will be automatically set to text/css and script will be automatically set to text/javascript. You can begin using that already, even though HTML5 hasn't been fully released yet.. it will work. :)

[tutvid]

@NikkexD Haha, yes, there are a look of great time saving features of HTML5 and CSS3, but I really didn't want to get into them here. This is a pretty basic tutorial, you gotta take it one step at a time.

I am planning on getting some HTML5 and CSS3 tutorials out in the very near future however.

N.

[NikkexD]

@tutvid Yeah, sounds good! I love your videos btw. When i was learning HTML and CSS in the beginning, you helped me a lot. And i still learn a few things watching your videos today.

[saveme4141]

Nathaniel great job clean and so much better than using a table based

form .

[andrei25ni]

great tutorial, thanks

[Fancylooks]

This is really proffessional teaching for free! It is great, thank you so much!

[tutvid]

@Fancylooks Thank you for watching!

N.

[Jebrone]

oh nice, just in time to be completing my web page for my web design class! :D I was using your other video's recently to complete it!

[tutvid]

@Jebrone Glad it helps(ed) you out!

N.

[tirathmistry]

Thank you so much Mr. Nathaniel for all your time in preparing these wonderful Detail video tutorials. I must say i am your fan of you & your no 1 tutorials also. You have done a great job in keeping the content as simple as possible for any newbie like me (to graphics world) to understand. Much appreciated and keep up your good efforts. Keep educate us on youtube Thank you

God bless you :-)

[tutvid]

@tirathmistry Thanks man! I appreciate that!

N.

[i3ak3ri301]

Hey Nathaniel, I got my whole entire form set up, but I tried to test it by sending an e-mail to myself and nothing happened. Do you know what might be the problem? I'm sorry if I sound so ignorant about this, I'm fairly new to coding and such.

[tutvid]

@i3ak3ri301 I would run a quick Google search for a "PHP form handler" you should find either a nice little script or even a tutorial on how to pop one together.

N.

[scientist100]

@tutvid you have a tutorial about this Nate and it works nicely, you should have pointed that out to him ;)

[sumosumo84]

@i3ak3ri301 do you have code behind what your doing, or are you magically expecting it to work. For email all you need is html and javascript. If you want logging in and stuff, you need php.

[sumosumo84]

@i3ak3ri301 do you have code behind what your doing, or are you magically expecting it to work. For email all you need is html and javascript. If you want logging in and stuff, you need php. Comment back, and ill pm you with exact code you need

[i3ak3ri301]

@sumosumo84 This was so long ago I don't even have it anymore

[antorobertson]

margin:0 auto 0 auto, does the same job as margin:0 auto; you should explain that man. Keep your code clean :P.

[FlegDesigns]

@antorobertson It does almost the same... Technically speaking.

[antorobertson]

@FlegDesigns yea it does the same true, but keeping your code short, keeps it neat, and just reduces your load times, not much, but yea..

[FlegDesigns]

@antorobertson Yeah, or even smaller just margin: auto;

[tutvid]

@antorobertson Caught! Yes, I typically try to shorthand as much as I can, but I forget sometimes. :)

Thanks for the heads up pal!

N.

[NobleValerian]

Bring it up and then don't explain... smooth - one value affects top, right, bottom, left - two values affect top and bottom with first value and right and left with the second - 3 values affect top with the first, right and left with the second, and bottom with the third - 4 values are easy to remember as clockwise from the top - first value affects top, second affects right, third affects bottom, and last affects left.

[xxashyy]

Ahhh. Video is much better now!

[tutvid]

@xxashyy Yep, changed a few settings, hopefully it is nice and clear for most everybody.

N.

[Techible]

you can also use a live HTML editor on the internet to see what your editing i use them all the time when im experimenting with HTML and CSS

[xxashyy]

Can't see the yellow code. It's too light.

[endx2]

wow, where was this last week lol

[davidknag]

cool!

[Animedancer87]

So helpful to see. Thank you so much!

[Jarock123]

Thanks for the tutorial.

[Wigzombie]

yay first comment

[CarbonXstudio]

1st! lol, i had to

[CarbonXstudio]

@CarbonXstudio srry :)