Jump to content

Welcome to Geeks to Go - Register now for FREE

Need help with your computer or device? Want to learn new tech skills? You're in the right place!
Geeks to Go is a friendly community of tech experts who can solve any problem you have. Just create a free account and post your question. Our volunteers will reply quickly and guide you through the steps. Don't let tech troubles stop you. Join Geeks to Go now and get the support you need!

How it Works Create Account
Photo

CSS and jpgs

Started by john545 , Jan 01 2008 02:28 PM

  • Please log in to reply

#16
Major Payne
Posted 06 January 2008 - 09:37 AM

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts

If you're just starting out learning HTML then I would not code using XHTML Strict, I would use HTML 4.01 Transitional:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR...ml4/loose.dtd">

It will be easier to validate.

I dont know about Dreamweaver 4 as I use Dreamweaver 8, but there is a built in validation tool here:

File->Check Page->Validate Markup

I wouldn't really recommend this. If anything, I would go right to strict and use semantic coding. Use of XHTML is over rated for the normal user, but strict should be used.

Thanks for confirming that DW has a validator. I knew it had a code cleaner that cleaned its own code up. I have DW 8, but too lazy to open it up to find out about validator. :)

Ron

Edited by Major Payne, 06 January 2008 - 09:38 AM.

  • 0

Advertisements

#17
Major Payne
Posted 06 January 2008 - 09:56 AM

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts

You can see the wrap I wanted here: http://www.homesecur....com/test2.html

Of course, I'm still stuck with my 200 errors, and I still have the 'ugly Firefox' problem. I tried deleting the little red indicators in the W3c errors messages, but that didnt help much. I just dont know CSS well enough. But I'll hunt around for a cleanup tool :)

I checked this page in IE and it really looks worse: [attachment=17642:john545_GTG.jpg]

That's FF's IE Tab view. Same as in my IE 7.0.

As to all your errors. I would drop the doc type down to strict: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Ron
  • 0

#18
john545
Posted 06 January 2008 - 12:28 PM

john545

    Member

  • Topic Starter
  • Member
  • PipPip
  • 72 posts
gunner,

Yes, I think I will avoid anything marked xhmtl strict :). Is there a way to relabel my current code without having to start from scratch ? Or is xhtml strict so embedded into the template that only the designer can change it ? I suspect the latter is the case, so Im probably stuck with this version.

As for validation, my Dreamweaver 4 does have a 'check html' function, but it is so basic that it comes back with no errors at all on this one. BUt it seems to work well on my other 4.01 transitional templates.

Question: Are newer version of Dreamweaver better in coding for both Firefox and IE ? Im just wondering if gettting an updated editor would give me cleaner code.

Thanks again !
john
  • 0

#19
john545
Posted 06 January 2008 - 12:35 PM

john545

    Member

  • Topic Starter
  • Member
  • PipPip
  • 72 posts
Ron,

Ugh.. worse in IE 7 ??? I didnt do anything different except add the ad block in the middle of the page. And iit looks just fine in my IE 6.

Im beginning to think that unless I use expert coding, the only way for me to get a clean view across multiple browsers is to go back to HTML 4. :)
  • 0

#20
Major Payne
Posted 06 January 2008 - 01:40 PM

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts

gunner,

Yes, I think I will avoid anything marked xhmtl strict :). Is there a way to relabel my current code without having to start from scratch ? Or is xhtml strict so embedded into the template that only the designer can change it ? I suspect the latter is the case, so Im probably stuck with this version.

As for validation, my Dreamweaver 4 does have a 'check html' function, but it is so basic that it comes back with no errors at all on this one. BUt it seems to work well on my other 4.01 transitional templates.

Question: Are newer version of Dreamweaver better in coding for both Firefox and IE ? Im just wondering if gettting an updated editor would give me cleaner code.

Thanks again !
john

You shouldn't have to redo your code just by changing your doc type. It will just be more tolerant when parsed and/or validated, but you still need to use good code and CSS that works in other browsers. IE is one of the most screwed up browsers out there when it comes to parsing web pages. It has a box model problem as well as a few other quirks.

I have no idea about new versions of DW. It is so expensive, I can't see paying the big bucks to keep it updated to latest web standards when there are easier WYSIWYG Editors out there. Some are even free like NVU. If DW meets the CSS2 standards, then it would be better to use for your pages. Then you would just need to make a CSS to fix IE. :)

If I find time, I'll try to fix the IE problems on the page I made. The template you are using probably doesn't use all the CSS styling it's calling out I would imagine.

Ron

Ron
  • 0

#21
john545
Posted 06 January 2008 - 04:18 PM

john545

    Member

  • Topic Starter
  • Member
  • PipPip
  • 72 posts
Ron,

Before you spend any more time on this, Im going to give it try to fix the IE/Firefox issues myself. After comparing, it looks like all of the problems are in the header code - not as extensivce as I thought. The original template is clean in both browsers, so Im going go back and work on that section in the original.

john
  • 0

#22
Major Payne
Posted 06 January 2008 - 05:21 PM

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts
OK. Let me know how it goes.

Ron
  • 0

#23
john545
Posted 06 January 2008 - 07:19 PM

john545

    Member

  • Topic Starter
  • Member
  • PipPip
  • 72 posts
Hi Ron,

Now take a look at this :)) http://www.homesecur....com/test2.html

Couple of css changes and then checking everylittle change in both browsers. Whew !!

There are still some tweaks to figure out. For example, I can't line up the sub heading "It Doesn't Have To..." But it's a minor point that I can live with.

Also, I only have IE6, so I can only hope it is close enough in IE 5 and 7. But at least FF is presentable :)
  • 0

#24
gunner12
Posted 06 January 2008 - 07:30 PM

gunner12

    Member

  • Member
  • PipPip
  • 46 posts
looks great in IE 7 :)
  • 0

#25
Major Payne
Posted 08 January 2008 - 12:21 AM

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts
I see some big differences between FF and IE. The sub heading "It Doesn't Have To..." doesn't appear in my IE. The Google ads under "Simplified Home Security: A Better Approach" images and "Related Products " don't show in FF. Other than these, it has a much better layout in IE now.

Validator now reports 184 Errors so you might want to change your doc type.

Good job.

Ron
  • 0

Advertisements

#26
john545
Posted 08 January 2008 - 01:13 AM

john545

    Member

  • Topic Starter
  • Member
  • PipPip
  • 72 posts
Very odd. Both the google ads and the subheading appear in both my firefox and IE6. Perhaps I didnt upload the latest version. I did notice that I had to clear my FF cache to see the changes. But looks the same in both now.

This is the doc type I have :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR...l4/strict.dtd">

Some of the "undefined" error messages seem to say that all I need to do is elminate all caps from the tags, correct ?
  • 0

#27
Major Payne
Posted 08 January 2008 - 01:41 AM

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts
OK. My fault on the no ads in FF. I keep forgetting I have Google ads banned. Changing to strict doc type has greatly reduced the number of code errors.

These can be removed: " /> ". These are the cause of most of the errors reported. Code like this, " <font face="arial" size="5"> ", should be changed to " <span style="font-family:arial; font-size:20pt;"> text here </span> ". Font tags are deprecated. This " <script language="JavaScript" type="text/javascript"> ... </script> " should be this: " <script type="text/javascript"> ... </script> ". Use of " <u></u> " or " <i></i> " type tags should be done with css. Most of the errors reported are easily correctable.

I take it we are still talking about test2.html page. It really does look so much better.

Ron
  • 0

#28
john545
Posted 08 January 2008 - 01:57 AM

john545

    Member

  • Topic Starter
  • Member
  • PipPip
  • 72 posts
Yes, we are still talking test2.html, and yes, it looks s000o much better. THANK YOU ! I appreciate you spending the time with a rookie :) Im not sure I can get my Dreamweaver 4 to code like you suggest, but I'll keep playing with it. If necessary, I'll make the corrections manually, since I do want to get this error-free if possible.

My next goal is to add a breadcrumb menu, but I'll start a new topic for that one.

Thanks again !

And thanks gunner, for your added help :)
  • 0

#29
Major Payne
Posted 08 January 2008 - 03:09 AM

Major Payne

    Retired Staff

  • Retired Staff
  • 5,307 posts
I don't think Dreamweaver will make the corrections. You will have to go to Code View and do it manually. I could probably do it here quickly and put it online for you to save.

Always glad to help.

Ron
  • 0
Back to Web Development · Next Unread Topic →




Similar Topics

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

  1. Geeks to Go Community
  2. → Development
  3. → Web Development

As Featured On:

Microsoft Yahoo BBC MSN PC Magazine Washington Post HP