Dreamweaver - Re: vertical/horizontal scroll bars appearing in FF

Author

Re: vertical/horizontal scroll bars appearing in FF

Stephanie Sullivan

2005-09-30, 6:20 pm

On 9/30/05 10:50 AM, in article dhjjcg$itt$1@forums.macromedia.com,
"DPSwebmaster" <webforumsuser@macromedia.com> wrote:

>
> and suggestions to adjust the CSS to make the div extend to the footer in FF?

Are you saying you want the footer to be at the bottom of the browser window
no matter where the page ends? Or are you asking how to make the footer come
after all your content? I'm not sure I understand. A cursory look at your
code makes it appear that removing overflow:auto from that div still leaves
your footer below it.

Can you expound?

Stephanie Sullivan
Community MX Partner :: http://www.communitymx.com/author.cfm?cid=1008
Team Macromedia for Dreamweaver :: http://tinyurl.com/6huw3
Co-Author .: "Macromedia Dreamweaver MX 2004 Magic" :. New Riders
VioletSky Design :: http://www.violetsky.net

"Watch what people are cynical about and one can discover what they lack."
-Harry Emerson Fosdick

DPSwebmaster

2005-09-30, 6:21 pm

Ideally I would want all pages the same height and the footer would always be
at the bottom. Right now, I don't have an example page to submit, but in FF if
I take out the overflow:auto part, the content div just stops after my right
column floated content, while the left column extends to the bottom like it
should. The left coulumn is extending because I have a repeating image as a
background. the content div (div>#text_area) *should* be extending to 100% of
the viewport (or so I thought), but for some reason it is not.

Stephanie Sullivan

2005-09-30, 6:21 pm

On 9/30/05 11:22 AM, in article dhjl7e$lji$1@forums.macromedia.com,
"DPSwebmaster" <webforumsuser@macromedia.com> wrote:

> Ideally I would want all pages the same height and the footer would always be
> at the bottom.

If you take advantage of the flow of the page, the height of the page would
be determined by the amount of content in the page.

> Right now, I don't have an example page to submit, but in FF if
> I take out the overflow:auto part, the content div just stops after my right
> column floated content, while the left column extends to the bottom like it
> should.

The page we're looking at makes it hard to see that since the two columns
are nearly equal height -- but see my notes below.

> The left coulumn is extending because I have a repeating image as a
> background. the content div (div>#text_area) *should* be extending to 100% of
> the viewport (or so I thought), but for some reason it is not.

AFAIK, there is no reliable way to do 100% height cross browser... Thus the
reason we use the faux columns tricks. Is this the graphic you're referring
to as the repeating image?
http://www.fortuneinteractive.com/v...line_repeat.gif

Is that the close of the "blocks" div I'm seeing right before the "padding"
div? If so, you should be able to put the background on that div instead and
have the line run the full length no matter which column is taller. You WILL
need to put move your clear classed div UP to RIGHT BEFORE the close of the
#blocks div.

(You should also be able to get rid of your padding div since you can put
the padding ON the blocks div at the bottom ... You could also get rid of
all the 100% heights in many of your selectors)...

The class for #blocks should look something like this (since you have to set
that line to show up where you want it to be -- this looked about right to
me):

#blocks{/*used for text blocks towards bottom of page*/
padding:0 2em 0 2em;
margin:0 1em 0 1em;
min-height:100%;background: #fff url(vertical_line_repeat.gif) 420px 0px
repeat-y;
}

Also, just thought I'd mention this:

div>#intro{/*hiding from IE*/
padding:0 2.1em 0 2em;
margin:.5em 1em 0 1em;
border-bottom:1px dashed #333;
}

#intro{
padding:0 2.1em 0 2em;
margin:.5em 1em 0 1em;
border-bottom:1px dashed #333;
}

html>div#blocks{/*used for text blocks towards bottom of page*/
padding:0;
margin:0;

}

#blocks{/*used for text blocks towards bottom of page*/
padding:0 2em 0 2em;
margin:0 1em 0 1em;
min-height:100%;
}

See the above selectors? Notice that you've got the "hide from IE" selector
before the one that IE CAN see? Problem is, the other browsers can see that
too -- so the things you're putting in the first selector, that you'd like
the other browsers to see -- are being overridden by the things you want
ONLY IE to see. You need to change the order of those selectors so that the
one you want IE to see is first -- THEN, have the one that's hidden, that
the OTHER browsers see so it will override the IE value. Make sense?

HTH,

Stephanie Sullivan
Community MX Partner :: http://www.communitymx.com/author.cfm?cid=1008
Team Macromedia for Dreamweaver :: http://tinyurl.com/6huw3
Co-Author .: "Macromedia Dreamweaver MX 2004 Magic" :. New Riders
VioletSky Design :: http://www.violetsky.net

"Ask yourself what makes you come alive, and go do that, because what the
world needs is people who have come alive." ~ Howard Thurman

DPSwebmaster

2005-09-30, 6:21 pm

so instead of:

div>#intro{/*hiding from IE*/
padding:0 2.1em 0 2em;
margin:.5em 1em 0 1em;
border-bottom:1px dashed #333;
}

#intro{
padding:0 2.1em 0 2em;
margin:.5em 1em 0 1em;
border-bottom:1px dashed #333;
}

I would need to have the order:

#intro{
padding:0 2.1em 0 2em;
margin:.5em 1em 0 1em;
border-bottom:1px dashed #333;
}

div>#intro{/*hiding from IE*/
padding:0 2.1em 0 2em;
margin:.5em 1em 0 1em;
border-bottom:1px dashed #333;
}

and repeat that for all selectors? That seems to make sense, and I will give
your other suggestions a try to see if that solves my problems. Thanks
Stephanie!

Stephanie Sullivan

2005-09-30, 6:21 pm

On 9/30/05 2:06 PM, in article dhjuqo$5kt$1@forums.macromedia.com,
"DPSwebmaster" <webforumsuser@macromedia.com> wrote:

> and repeat that for all selectors? That seems to make sense, and I will give
> your other suggestions a try to see if that solves my problems. Thanks
> Stephanie!

Right... This should be repeated for anything where you're hiding something
from IE because the other browsers can read both ... Even though the
specificity is slightly higher for the non-IE selectors, I would change
their order to make everyone play nice.

Let us know how the other fixes work out. :)

Stephanie Sullivan
Community MX Partner :: http://www.communitymx.com/author.cfm?cid=1008
Team Macromedia for Dreamweaver :: http://tinyurl.com/6huw3
Co-Author .: "Macromedia Dreamweaver MX 2004 Magic" :. New Riders
VioletSky Design :: http://www.violetsky.net

"Destiny is not a matter of chance; it is a matter of choice. It is not a
thing to be waited for; it is a thing to be achieved." -William Jennings
Bryan