First Responsive Attempt - Help! - WebDeveloper.com Forums

This site is best viewed in a modern browser with JavaScript enabled.

First Responsive Attempt - Help!

Rickjb39

I have been working on this webpage in attempting responsive design for the first time. (I only started html/css coding last week). My problem is when i resize my web browser i can't get the "Contact" form on the right to keep still. The thing just moves up and down. Any help would be appreciated.

http://www.webdevrick.co.uk

rondavid

Hello,

In CSS try not use fixed size of the contact form, that will help, also use percentage values instead of pixels.

kralcx

the title Contact Us needs some top padding, but otherwise the responsive design worked for me on Firefox.

blasphemy

I looked into your code. You have:
- '<DOCUTYPE! HTML>' instead of '<DOCTYPE! html>'
- you have only one 'h1' on your page, so you don't need 'id="title"' for it. You can just use 'h1' (or 'header h1' or 'header > h1') in your CSS
- 'h1' should be clickable and follow to main page, link 'home' in navigation is unnecessary
- again: you have only one 'nav' with 'ul', so you don't need 'id="nav_links"' for 'ul'.
- 'id="section_heading"' for more than one element
- unnecessary 'class="paragraphs"' for 'p', you can use 'section p' in your CSS
- instead of '<div id="footer">' you can use new tag 'footer' from html5
- '</div' without '>' before '</body>'

Rickjb39

blasphemy;1308371 wrote:
I looked into your code. You have:
- '<DOCUTYPE! HTML>' instead of '<DOCTYPE! html>'
- you have only one 'h1' on your page, so you don't need 'id="title"' for it. You can just use 'h1' (or 'header h1' or 'header > h1') in your CSS
- 'h1' should be clickable and follow to main page, link 'home' in navigation is unnecessary
- again: you have only one 'nav' with 'ul', so you don't need 'id="nav_links"' for 'ul'.
- 'id="section_heading"' for more than one element
- unnecessary 'class="paragraphs"' for 'p', you can use 'section p' in your CSS
- instead of '<div id="footer">' you can use new tag 'footer' from html5
- '</div' without '>' before '</body>'

Thanks for this helped me alot.

blasphemy

Ooops. I've made a mistake. There should be '<!DOCTYPE html>', not '<DOCTYPE! html>'.

Rickjb39

blasphemy;1308567 wrote:
Ooops. I've made a mistake. There should be '<!DOCTYPE html>', not '<DOCTYPE! html>'.

No problem.