Jump to content
Stef's Coding Community
TravisWBurton

New To Css, Need Help W/ Page Width

Recommended Posts

I have always built my sites in HTML, I am starting a new site for a new client and want to use CSS.

 

I had the site looking fair until I wanted to add the code to set the width at 800px. For now the site is only on my laptop and not on a server, so I am attaching the files.

 

Any help in getting it fixed and explaining what I did wrong would be super.

 

Thanks.

 

Travis

law.css

index.html

Share this post


Link to post
Share on other sites

There are several errors in your code. this is what your page looks like as it is in the code you provide above: http://aandbwebdesign.com/KSforum/trav1.html

 

These are the most obvious errors in the HMTL I note:

  • You are missing the UTF coding
  • Center Tag is obsolete (use CSS)
  • Font Tag - also obsolete
  • Attorney is usually spelled without a 'u'
  • bgcolor is inline styling - use css instead
  • A navigation menu is a list and should be coded as such
  • You're randomly opening p tags
  • Adding hit counters is a pretty outdated practice from the early 1990's
  • Overall, make sure all your divisions have proper closing tags in the right place

CSS issues:

  • The opening style tag is not needed
  • Define the font once along with the body or html tag - after that, you only have to specify if you want something in a different font
  • h tags are by default bolded, no need to bold them again
  • pt is for print, for websites, use px or em to size your fonts
  • No need to position the body - it's just there (you are setting it relative
  • text-align center and then back to left is the outdated way of centering divisions - give you container a width and center it with a right-left margin of auto
  • If a font name consists of more than one word, you need quotes around it - "comic sans ms" or "times new roman" - but just arial --- no quotes.

I'm working on an updated page, but ran out of time. Pesky day-job of mine, always interfering with the fun.

 

 

 

Share this post


Link to post
Share on other sites

A great list from Andrea and I would like to add that if you are using any kind of HTML editor I would suggest that you avoid using the Design View window or WYSIWYG. Based on Andrea's findings it seem like you are using an old editor thus it's not up to date with standards.

Share this post


Link to post
Share on other sites

Eddie, Yes the HTML editor is not up to date with standards....it is "ME" and I am getting older every day, ha ha. I haven't coded a new page in a while. Although I have used an HTML editor software in the past, somehow I always liked coding by hand better, so I either use notepad/wordpad or pico depending on which OS I am on.

 

A great list from Andrea and I would like to add that if you are using any kind of HTML editor I would suggest that you avoid using the Design View window or WYSIWYG. Based on Andrea's findings it seem like you are using an old editor thus it's not up to date with standards.

Share this post


Link to post
Share on other sites

http://aandbwebdesign.com/KSforum/trav2.html

 

I removed a lot of the CSS just to focus on the essentials. I did leave a few comments to explain what I did. The background colors are just so you can see where things are, not my idea of eye-pleasing design :rolleyes:

 

If anything doesn't make sense, just ask.

Share this post


Link to post
Share on other sites

Hello, just jumping in to give you a little advice on code editors. It will help if you choose one with code coloring and line numbers. These help see typos easier. Instead of notepad for the pc try notepad++. A free download for the pc. There are many notepad++ is just the one that I use. If you want something a little more robust for free, give Komodo Edit and Aptana Studio a try. Both of these have a PC and a Mac version.

Edited by grabenair

Share this post


Link to post
Share on other sites

I was curious and clicked on the twb webmaster link on your sample page and then clicked on the one site with the one * (design site) I got an OOPS page.

Share this post


Link to post
Share on other sites

@Andrea, Thanks for the help. It is starting to make more sense. Also, I deleted the URL that gave the oops page and replaced it with place holder text.

 

@grabenair, Thanks, I downloaded Notepad++, like it a lot better than MS Notepad.

 

I was curious and clicked on the twb webmaster link on your sample page and then clicked on the one site with the one * (design site) I got an OOPS page.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...