This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Dreamweaver > March 2006 > Spacing error with Halo Left Nav template





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author Spacing error with Halo Left Nav template
mauryg

2006-02-12, 6:42 pm

To Murray or anyone else...
I have been struggling with this glitch for several days. If I create a new
page using the Halo Left Nav (CSS) template, I notice that the spacing between
the "story" div (the one just under the "feature" div in the pagecell) and
the "capsule story" table below it is slightly larger when previewed in IE6
than it is in Foxfire or Netscape. I am viewing at full screen 1028x768
resolution.
If I now go into the HTML code and apply an HTML comment to the "story" div to
delete it, the table div moves up just under the "feature" div in Firefox and
Netscape6, but in IE6 it appears that the original "story" area is simply
blank and the space is retained so that there is this huge white space between
the first div and the table. The same thing happens if I actually delete the
story div code. And to further confuse the issue, the same thing happens if I
change my screen resolution to 800x600.
I have tried changing the CSS code to alter or eliminate the min-height
parameter which I understand is not handled properly in IE, but to no avail.
HELP...I can't imagine that no one has seen this problem since this template
came out in DWMX. Any ideas???

Maury

mauryg

2006-02-16, 6:38 pm

After a little logical thought the answer was so simple as to be stupid...

The "feature" section of the emx_nav_left.css style sheet has the code:

.feature{
padding: 0px 0px 10px 10px;
font-size: 80%;
min-height: 200px;
height: 200px;
}
html>body .feature {height: auto;}

but the "story" class had the code:

.story {
padding: 10px 0px 0px 10px;
font-size: 80%;
}

The answer was to ADD the min-height and height parameters to the .story class.

.story {
padding: 10px 0px 0px 10px;
font-size: 80%;
min-height: 200px;
height: 200px;
}

Now the spacing is correct in all 3 browsers, even when I comment out the
"story".

AARRRRGGGHHHH! :disgust;

tnuaga

2006-03-28, 6:29 pm

Hello, mauryg,

I've just begun building a few pages with the Halo Left Nav template and
encountered the same problem. I applied your fix to the story class in the
style sheet and voila! Fixed! HOWEVER - now, even though the page displays
properly in Mozilla, Safari, Firefox, IE for Mac, and IE 6, it is totally
destroyed in DW! The story table width is at 100% - which it has decided is a
mere 184 pixels wide. Changing the width to 99%, as suggested by another happy
customer, did nothing for DW's rendition.

Do you - or does anyone else - know how to make this template happy in all
environments? Murray - I've read your frequent adminition that one must be
comfortable with Javascript and CSS. I would give myself a comfort rating of 2
on a scale of 1 to 5, so you'll probably rap my knuckles for wanting to proceed
with this technology, but I sort of committed to using this for a makeover of
our site BEFORE I was aware of the problems - which, of course, didn't emerge
in my prototype pages for approval. Does anyone know why DW has freaked out
with this minor tweak?

Thanks in advance ...
Anita

mauryg

2006-03-28, 6:29 pm

Hi Anita,

I must admit that I have learned quite a bit since I started playing with the
Halo_Nav_Left template. I only wish that Macromedia would make the new updated
version that they use on THIS page available to us.
With regard to the height adjustments, I found in the end that because I vary
the arrangement of content from page to page(sometimes only "feature" and
sometimes only the table) that it was more convenient to use inline style code
rather than the external sheet. That way I can vary the height and min-height
parameters for each page separately.

<div class="story" style="height:400px; min-height: 500px;">
<table width="100%" cellpadding="0" cellspacing="0" summary="">
<tr valign="top">
<td width="49%" class="storyLeft"></td>
and in the right hand cell
<td width="51%">


mauryg

2006-03-28, 6:29 pm

Hi Anita,

I must admit that I have learned quite a bit since I started playing with the
Halo_Nav_Left template. I only wish that Macromedia would make the new updated
version that they use on THIS page available to us.
With regard to the height adjustments, I found in the end that because I vary
the arrangement of content from page to page(sometimes only "feature" and
sometimes only the table) that it was more convenient to use inline style code
rather than the external sheet. That way I can vary the height and min-height
parameters for each page separately.

<div class="story" style="height:400px; min-height: 500px;">
<table width="100%" cellpadding="0" cellspacing="0" summary="">
<tr valign="top">
<td width="49%" class="storyLeft"></td>
and in the right hand cell
<td width="51%">


tnuaga

2006-03-28, 6:30 pm

Thanks, Maury. I applied all the code you suggested to both the css and the
page itself and the page displays nicely in the browsers, but it's still weird
inside DW. On one page - which includes an image in "feature" - the "story"
ends up at 184 px wide for 100%. On another page, the same section is only 150
px wide for 100%. Sheesh. I guess it's not the end of the world that my
working view is bizarre as long as what the rest of humanity sees is normal.

I'm with you, too - I wish Macromedia would share the love with the rest of
us, especially since this is part of the purchased package!

Again, thanks a million for your help. Let all of us know if you run into any
additional goodies.
Anita

Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews