Discrepency between Tutorial and my Screen following DreamWeaver 8 Kit

[JamesCGI]

Evening all,

I'm following along with the Building Websites with Macromedia Dreamweaver 8 and a little thing jumped out to me. In chapter 2 lesson 11, the instructor has typed out 1-880-555-5555 copyright (c) 2007 Rockwell" in the header. Now he has applied the <div> tag and I noticed something odd with the designer view of the page.. I'm following along with Dreamweaver CS 3 so this might be a discrepency due to version changes, however it does seem odd.

This is how things look in the DT Tutorial

http://taras.lunarservers.com/~cente28/XSIBASE/dt-correctfromtutorial.jpg

This is how it looks in DW CS3

http://taras.lunarservers.com/~cente28/XSIBASE/dt-problemwithdesignview.jpg

I'm wondering if there is some setting that may be causing this, but it jumped out because while the page previews fine in IE and Firefox, the design view becomes very different with this odd space created by the float:right style.

Thanks for any light you can shed,

James

[laxman]

its hard to diagnose like this. HTML has a way of doing random things sometimes. Does it look like it is supposed to in firefox and IE? If it does I would just ignore it. If it is different, try zipping that HTML page and attaching it here so we can take a look at it.

[JamesCGI]

*EDIT - the fix below is not a good idea, please see post following this one*

Laxman,

very true. I think it's the way DW CS3 is interpretting the <p> tag.
I started a new index.htm with just a 1 row 1 colunn table and duplicated the attempt and found that the layout distortion was still there in the design view, so I'm pretty sure it's just a DW CS3 issue.

If I avoid the <p> tag and use a css class style such as .headertext to change the text color/font/float settings everything works fine. I'll do that and avoid using the <p> tag in the footer for now.

Thanks for the quick response!

~ James

[JamesCGI]

Grrrr ok my anal retentive nature is going to win. My solution of avoiding the <p> tag is not the best one.

Here is a simplified HTML page that just has a 3 row table, with the bottom row the footer. It's a simplification of the design in the tutorial (which is great by the way). I've got two sentences, "Footer Left" and "Footer Right"

Link to HTML page made in DW CS3 -> Link (http://taras.lunarservers.com/~cente28/dt/footerdisplayissue.html)
http://taras.lunarservers.com/~cente28/dt/dt-problemwithdesignview2.jpg

I'm real curious if it is just DW CS3 that is doing this, because I really liked the fact that in the tutorial with DW 8 the design view closely matched the output. Having spaces issues like this everytime I use a style:float command is not fun. So if anyone has a sec and duplicates this design view issue in DW CS3 (or not in a different version) I'd apprciate it. I'd love to find out it's just some setting in DW CS3 that is causing this.

Thanks again,

James

[laxman]

try making a float left stlye and putting the left footer around a div tag. That might space them evenly. Also, does it look fine in an internet browser?

[JamesCGI]

laxman,

I tried that this morning. It's odd, still getting a "space" above the div tagged marked text in the design view. It looks fine in firefox (the space is not there in the header), just a shame that the design view is always gonna be a bit messed up. I've selected the div tag in the screen shot, you can see a blue box around the text and how the box is twice as high as the text is. Very strange.

http://taras.lunarservers.com/~cente28/XSIBASE/dt-problemwithdesignview3.jpg

I still wonder if it's some odd kind of option in DW CS3 to mark div tags this way or something. Oh well, I think I'll have to let this go :P

~ James

[laxman]

well, there is no option to do that. One thing you should keep in mind is that small things like that don't matter unless they are distorting the layout of the site. Random stuff like that tends to happen. That being said, two thing you could try:

1. add another property to the CSS classes, and make it align top.
2. If you are using div tags there, it seems like you shouldn't be needing the <p> tags. You could just get rid of them.

[JamesCGI]

laxman,

Thank you for your help. This is a small issue and one that I'm going to chalk up to the html gods. I imagine it's just a slight difference in code from Dreamweaver 8 to CS 3 or some such. Thank you for your help!

~ James