Re: [css-d] Hard to achieve pure CSS layout

[Bill Brown]

Frederico Caldeira Knabben wrote:
>   http://www.fckeditor.net/_temp/editor_layout.html
> This is a kind of a simple and basic need, and it's a pity to see this CSS
> limitation. So, I still have some faith... does anyone there have a
> brilliant solution for it?

While this layout may be "simple and basic" aesthetically, 
programmatically, it is not:

CSS allows for the rendering of element style on the fly. There is no 
way for the browser to know the height of the middle section while it is 
rendering the header section of your layout. Likewise for the footer and 
the middle section.

At best, any configuration will be fragile in a cross browser setting. 
You could increase its robustness if you used known heights for the 
header and footer, which I gather is not something you want. If I were 
asked to code this for a client, I'd use a simple JavaScript, which 
could accomplish it quite easily.

You might also find some answers in a search for CSS Frames or CSS 
Sticky Footer.

Hope it helps.
Bill

-- 

__
css-discuss [cs...@lists.css-discuss.org]
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/

[css-d] Sticky footer - double decker possible?

[Anne E. Shroeder]

My client has a design comp that I'm finding extraordinarily challenging to 
implement -- the currentt challenge is implementing a sticky footer that has 
two parts AND that maintains a right/left border on the center column (right 
and left column contain no content) that extends all the way down to the 
footer.

Using the methodology described here: 
http://brassblogs.com/blog/sticky-footer  I've been able to implement the 
basic grey line along with the left/right shadows and get the footer to 
stick to the bottom - BUT not the left/right borders to extend down.

Worse, when I add the image of the water on top of the grey line, I find I 
can only put in a min-height to get it to work - which really means it isn't 
working.

When I add in the orange crossbar, everything breaks apart.  Yikes.

Is it possible to code this?

The comp is here: http://www.language-works.com/swim/comp.jpg
My rather unsatisfactory implementation here: 
http://www.language-works.com/swim/stickyfooter.htm

Anne


__
css-discuss [cs...@lists.css-discuss.org]
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/

[css-d] page review

[David Laakso]

Comments and suggestions appreciated.

Best,
~d
__
css-discuss [cs...@lists.css-discuss.org]
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/

[css-d] Hard to achieve pure CSS layout

[Frederico Caldeira Knabben]

Hi all,

The problem is extensively described in the following URL:

http://www.fckeditor.net/forums/viewtopic.php?f=11&t=13527

It's related to the layout presented here:

http://www.fckeditor.net/_temp/editor_layout.html

Tested with IE6, IE7, FF2, FF3, Opera 9.6, Safari 3 and Safari 4, all of
them in quirks and standards mode (14 test! What a life!). It works on all
of them, except IE and Opera, both in standards mode only.

We don't need any beautiful and standards aware CSS and HTML structure. It
can be any kind of weird stuff (just like the table I've created so far), as
long as we are able to precisely control the height of the entire structure,
having the central part still flexible.

This one is driving me crazy. I've worked on it for days. No lucky, so I've
hired 3 different "CSS experts". All of them told me that it was a kid's
job, dropping the towel later saying that they don't know how to fix it.

This is a kind of a simple and basic need, and it's a pity to see this CSS
limitation. So, I still have some faith... does anyone there have a
brilliant solution for it?

Thanks in advance,
Fred


__
css-discuss [cs...@lists.css-discuss.org]
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] Display problem with IE7

[David Laakso]

Ansari Samir wrote:
> Hi,
>
> My site http://jobspert.com opens properly in Mozilla Firefox but when I
> open it in IE7, there comes a one pixel gap between the header and the
> buttons "Submit Resume" and "Browse Jobs".
>
> Can someone please tell me what to do to get rid of this?
>
>
>   


Add this to your style sheet:

img {display: block;}

btw, the gap (space for descenders?) is not necessarily limited to 
IE/7--  noticed here as well live in Mac SeaMonkey, Safari, and Camino. 
And in Mac FF on a local file.




__
css-discuss [cs...@lists.css-discuss.org]
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/

[css-d] Display problem with IE7

[Ansari Samir]

Hi,

My site http://jobspert.com opens properly in Mozilla Firefox but when I
open it in IE7, there comes a one pixel gap between the header and the
buttons "Submit Resume" and "Browse Jobs".

Can someone please tell me what to do to get rid of this?

Regards,
Ansari Samir.





-- 
M/S Leelan
123, S.V. Road, Khar (W), Mumbai - 400 052.
Cell: +919820200390 / +919223267824 Fax: +912226040803
Tel: +912226051830
__
css-discuss [cs...@lists.css-discuss.org]
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] menu background images don't appear at hovering - SOLVED

[B . de Nijs]

Hello,

I've figured it out, I (simplyharhar... hours later) had to add:

#mainmenu a { display: block;}

to make the hovering bg images all appear fine 
(still, I don't why the normal bg images showed fine and only at  
hovering they didn't ...
I really hate it if I don't understand the (weird or logical)  
behaviour behind the cssscenes ...)

thanks for all who tried to help,

bye,
beate
__
css-discuss [cs...@lists.css-discuss.org]
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] Browser issues

[Alan Gresley]

Climis, Tim wrote:
>> What do you mean by "a bit of a margin doubling bug"? I would love to
>> fix any problems you detect.
> 
> If you look closely (and it's easier to see with a firefox extension like 
> IETab), you'll notice that the margins between things are bigger in IE than 
> in Firefox/Safari/Opera.  Usually the cause of this is a bug in IE.
[...]
> ---Tim


What bug? This is just default vertical margins being fixed in IE7- at 
14.25pt or 19px. All other browsers (including IE8) have default 
vertical margins of 1em which is equivalent to 16px (under a 16px text 
size setting).


-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
css-discuss [cs...@lists.css-discuss.org]
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] simple margins not collapsing

[Alan Gresley]

Trevor Nicholls wrote:
> Hello
> 
> Can somebody please explain why the lower margin of my first para and the
> upper margin of my "fragment" div are not collapsing? How could I fix this?
> 
> I've seen this gap in both IE7 and FF3. The target market is IE6+.
> 
> Thanks in advance
> Trevor
[...]


Hello Trevor.

The margins you mention will not collapse since float:left declared on 
div.fragment creates a new block formating context [1]. The specs says 
that vertical margins between a floated box and any other box do not 
collapse [2]. I would remove the margin from div.fragment completely and 
just give one margin-bottom.

div.fragment {
   float: left;
   /* margin: 1em 0 1em 0; */
   margin-bottom: 1em;
  }


1. 
2. 


-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
css-discuss [cs...@lists.css-discuss.org]
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/