Re: [css-d] Wrapper is not wrapping...footer is at the top

[David Hucklesby]

On Mon, 22 Oct 2007 17:55:45 -0700 (PDT), Jeralyn Merideth wrote:
> Thanks to everyone who answered. I took the absolute positioning correction 
> advice and
> worked it out. I kept working on it and so anyone who answered this later may 
> not have
> seen the correct code :-)
>
> Anyway, all is lined out and looking good in FF and IE7...I don't have 6. 
> could someone
> do a site check for me?
>
> http://www.5pts-interactive.com/sarantopoulos/index.asp
>

Rafael mentioned the IE6 PNG problem, and David suggested the use of
the PNGFIX HTC file[1]. Another suggestion, if you are okay losing the
reflection effect in IE6 and below, is to use an 8-bit PNG[2]. I just
tried this out on your page, and I think it looks okay. The PNG-8 file
is under 8k, cf. 21k for the 24-bit version.

Another small issue - the links at the top of the page seem to push
the #logo block down when text size is increased, putting it out of
line with the "banner.jpg" you use as BODY background. Not too badly
though.

[1] 
[2] 

Cordially,
David
--


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Wrapper is not wrapping...footer is at the top

[Rafael]

Jeralyn Merideth wrote:
> Thanks to everyone who answered. I took the absolute positioning correction 
> advice and worked it out. I kept working on it and so anyone who answered 
> this later may not have seen the correct code :-)
>
> Anyway, all is lined out and looking good in FF and IE7...I don't have 6. 
> could someone do a site check for me?
>
> http://www.5pts-interactive.com/sarantopoulos/index.asp
>   
Everything looks OK... except for the PNG you're using (since IE 6 
doesn't support PNG's), which appear with a white background. It's a 
little weak against font-resizing, though.

Rafael.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Wrapper is not wrapping...footer is at the top

[David Laakso]

Jeralyn Merideth wrote:
> Thanks to everyone who answered. I took the absolute positioning 
> correction advice and worked it out. I kept working on it and so 
> anyone who answered this later may not have seen the correct code :-)
>
> Anyway, all is lined out and looking good in FF and IE7...I don't have 
> 6. could someone do a site check for me?
>
> http://www.5pts-interactive.com/sarantopoulos/index.asp
>
> Thanks,
>  
> Jeralyn Merideth - Owner
>


Personally, I think the advice Georg Sortun offered could have been your 
best bet.

Nevertheless, you may want to set a min-height (in em?), and height 
(same value as min-height for IE6.0 (in em?) to account for font-scaling 
in compliant
browsers, and even IE7.0 and IE6.0, for the navigation in #topmast.

And perhaps something like p.last {margin-bottom: 2em} ... for the last paragraph of the primary content text 
so it has a little lead under it.

The text image (transparent png?) is not supported by IE6 and down. I 
know little about such matters and can only suggest, Google-- subject 
line: iepngfix.

Best,

~dL

PS And remember, not to forget, you'll want to use doctype XHTML 1.0 
Strict rather than what you have. Someone more technically oriented than 
me may explain why...





__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Wrapper is not wrapping...footer is at the top

[Jeralyn Merideth]

Thanks to everyone who answered. I took the absolute positioning correction 
advice and worked it out. I kept working on it and so anyone who answered this 
later may not have seen the correct code :-)

Anyway, all is lined out and looking good in FF and IE7...I don't have 6. could 
someone do a site check for me?

http://www.5pts-interactive.com/sarantopoulos/index.asp

Thanks,
 
Jeralyn Merideth - Owner

Designs by Jeralyn 
A Division of
5 Points Interactive
Creative Design Solutions for Web and Print
[EMAIL PROTECTED]
[EMAIL PROTECTED]

Ida Goldina - Natural Skin Care
[EMAIL PROTECTED]



- Original Message 
From: David Laakso <[EMAIL PROTECTED]>
To: Jeralyn Merideth <[EMAIL PROTECTED]>
Cc: css-d@lists.css-discuss.org
Sent: Monday, October 22, 2007 3:28:08 PM
Subject: Re: [css-d] Wrapper is not wrapping...footer is at the top


Jeralyn Merideth wrote:
> I'm looking at my own code
> from other projects and am doing the same thing...it's just not
 working
> out this time. Could someone take a look at my code (I've updated it
 on my server)
> and see what is going on? Maybe I'm just missing something.
>
> http://www.5pts-interactive.com/sarantopoulos/index.asp
>
> TIA,
>  
> Jeralyn Merideth
>
>   

This, in all likelihood, will not resolve the issues, but it may help 
get you on track-- it is all that absolute positioning,  and in some 
places restrictive height, that may cause some of the problems.
Try a test page putting a border: 1px solid fuchsia; on both the 
#wrapper and #footer. And start deleting the absolute positioning and 
heights until the wrapper opens and the footer is below it.
The entire layout could be handled easily with floats.

You'll want a  XHTML 1.0 Strict doctype rather than what you have.

Others on the list may provide you with a simple fix. Good luck and
 hang 
in there...

Best,
~dL

-- 
http://chelseacreekstudio.com/






__
Do You Yahoo!?
Tired of spam?  Yahoo! Mail has the best spam protection around 
http://mail.yahoo.com 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Wrapper is not wrapping...footer is at the top

[Gunlaug Sørtun]

Jeralyn Merideth wrote:
> http://www.5pts-interactive.com/sarantopoulos/index.asp

David and Ingo have pointed to the absolute positioning as the problem,
so why not get rid of that A:P and give the 'clearfix' a chance.

Adding / correcting to...

#wrapper {margin-top: 63px; position: relative;}
#navbar {top: -63px;}
#masthead {position: relative; top: 0;}
#content {position: relative; top: 0;}

...makes it all line up fine at my end, but I've only checked in Opera,
Firefox, IE6 and IE7.

regards
Georg
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Wrapper is not wrapping...footer is at the top

[Ingo Chao]

Jeralyn Merideth wrote:
> Hi group. I need more help! This project is quickly becoming the bain
> of my existence! I don't know why, but the wrapper, is not acting like
> a wrapper. Inside dreamweaver, when I click on the wrapper div, it's
> just a couple pixels high and everything else if falling outside of it.
> Because of this, I can't get the footer on the bottom. It's sitting
> where it's supposed to sit...under the wrapper. The problem is that the
> wrapper is at the top of the browser.
> 
> ...
> 
> http://www.5pts-interactive.com/sarantopoulos/index.asp

#wrapper cannot contain #navbar, #masthead, #content with a clearfix, 
since these are not floats, but absolutely positioned elements, taken 
out of any flow. Instead, #wrapper collapses, and #footer follows.

There is probably a javascript solution [1], as many believe in absolute 
layouts.

Ingo

[1] 
http://www.shauninman.com/archive/2006/05/22/clearance_position_inline_absolute

-- 
http://www.satzansatz.de/css.html
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Wrapper is not wrapping...footer is at the top

[David Laakso]

Jeralyn Merideth wrote:
> I'm looking at my own code
> from other projects and am doing the same thing...it's just not working
> out this time. Could someone take a look at my code (I've updated it on my 
> server)
> and see what is going on? Maybe I'm just missing something.
>
> http://www.5pts-interactive.com/sarantopoulos/index.asp
>
> TIA,
>  
> Jeralyn Merideth
>
>   

This, in all likelihood, will not resolve the issues, but it may help 
get you on track-- it is all that absolute positioning,  and in some 
places restrictive height, that may cause some of the problems.
Try a test page putting a border: 1px solid fuchsia; on both the 
#wrapper and #footer. And start deleting the absolute positioning and 
heights until the wrapper opens and the footer is below it.
The entire layout could be handled easily with floats.

You'll want a  XHTML 1.0 Strict doctype rather than what you have.

Others on the list may provide you with a simple fix. Good luck and hang 
in there...

Best,
~dL

-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/