[css-d] IE layout blues

2009-05-21 Thread David Bailey
Hi,

I am having trouble with several things in IE with a site I'm working  
on and seek some advice. I'm still grappling with a few areas of css  
so the issues may be simple, but I just can't see them!

Please look at http://www.webanz.com/webanz_new/index3.php.
Stylesheets:
http://www.webanz.com/webanz_new/styles/layout.css
http://www.webanz.com/webanz_new/styles/layout_ie.css
http://www.webanz.com/webanz_new/CSSMenuWriter/cssmw/menu.css
http://www.webanz.com/webanz_new/CSSMenuWriter/cssmw/menu_ie.css

I'm working on a Mac and also have a PC running XP and IE 6. I have  
run the site through browsershots.org and looks like I'm getting  
various results particularly in IE 7+ .

The issues I see are:

1. IE 6 and down to 5.0:
The layout renders basically the same as in Safari and FF (Mac) but  
the top horizontal (brown) navigation bar is supposed to have sub- 
menu dropdown items which aren't working. Any ideas what is causing  
this? I've had several attempts at fixing it, as you will see in the  
menu_ie.css stylesheet.

2. IE 7 on XP and FF on Win 2000
Have layout issues and drops the left hand background panel down the  
page. And renders the text in the top horizontal navigation bar in a  
dark colour!

3. IE 8
Has a few issues with not centering items in the left hand side  
panel, and also renders the text in the upper hor navbar in a dark  
colour.


Is there some obvious issues I'm not aware of here that can easily be  
addressed? I take it that it has something to do with hasLayout?

Any guidance, pointers, solutions would save me what's left of my hair!

Regards,
David


__
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] IE layout blues

2009-05-21 Thread David Bailey
Hi Kevin,

On 22/05/2009, at 12:51 AM, Kevin Doyle wrote:
 - IE Tester download: http://www.my-debugbar.com/wiki/IETester/ 
 HomePage (it's in beta, so there are a couple bugs -- still  
 ~totally~ worth downloading)

I've downloaded this and it looks quite good. This and probably  
Quiller's suggestion is very helpful. I only have one PC and not able  
to check the different browsers as I make adjustments, and I was  
envisaging having to check in the screenshots of browsershots.org  
every change I make!. I guess the quality and bugs will be sorted out  
over time in this program. It didn't like the javascript error that  
is apparently part of the navbar (from Web Assist's CSS Menu Writer),  
so I'll have to sort that out first before I can use it properly.


 - Firebug plugin for FF: http://getfirebug.com/

I have used this plugin on my Mac, and have just downloaded the pc  
version. Great tool.

 - Conditional comment CSS IE hacks: http://www.quirksmode.org/css/ 
 condcom.html


I am aware of the value of these conditional comments and, as the  
header of the page shows, I have used them on this site. But my real  
issue is as mentioned above, how do I start testing for each of these  
browsers. Also, I'm relatively new to css, or, at least somewhat out  
of touch with it for a while and things have moved along quite  
rapidly it appears!

Thanks for your suggestions and advice.

Regards,
David
__
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] IE layout blues

2009-05-21 Thread David Bailey

On 22/05/2009, at 3:30 AM, Quiller wrote:
 I'd like to add my two cents to Kevin's suggestions.
 Instead, I prefer to use the Virtual PC images made available by  
 Microsoft. The whole setup is free and provides an exact  
 replication of different environments from IE6/XP to IE8/Vista.

 Virtual PC 2007 (free):
 http://www.microsoft.com/downloads/details.aspx? 
 FamilyId=04D26402-3199-48A3-AFA2-2DC0B40A73B6displaylang=en

 Images for IE6, IE7 and IE8:
 http://www.microsoft.com/downloads/details.aspx? 
 FamilyId=21EABB90-958F-4B64-B5F1-73D0A413C8EFdisplaylang=en

Thanks, Quiller. Looks great, and downloading now. Should be a great  
help.

David


__
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] IE layout blues [correction to url]

2009-05-21 Thread David Bailey

On 22/05/2009, at 5:30 AM, David Laakso wrote:
 This line above the doctype puts IE/6  in quirksmode.
 !-- HEADER INCLUDE Goes here --

Okay, that does change things dramatically. Obviously, I need to  
learn more about quirksmode. It now acts more like IE 7 in dropping  
the content of the left-hand panel, and aligning the content to the  
left. It appears I've been making adjustments to the IE style sheet  
to suit quirksmode, because it now works better using the


 If it is deleted and the width of this selector is reduced, you may  
 avoid the float drop:
 #left-panel { border: 1px solid fuchsia;
float: left;
  width: /*16%*/15%;
padding-top: 10px;
padding-left: 2%;
padding-right: 2%;
 }
Okay, I've made a couple of other adjustments now to the other floats  
and they all sit together better (along the lines of the main style  
sheet), so the above adjustment wasn't necessary. I've now got to try  
and solve the right alignment problem.


 It is difficult to bring your page up at all in the IE browsers  
 because of the js errors.

Yes, I only became aware of this later for something but it seemed to  
point to the javascript in the menu (produced by Web Assist's CSS  
Menu Writer). But I have another page (http://www.webanz.com/ 
webanz_new/int-tmpl-3col-3.php ) which for some reason, while it was  
affected by eliminating quirksmode, didn't show the same changes as  
did the index page. Also, the javascript error doesn't show up on  
this page, so I'm thinking that the javascript error has something to  
do with the image rollover sequence on the home page (produced by  
Dreamweaver 8, as I don't know javascript well enough). I'm sure I've  
seen that this sort of thing can be done using CSS, so I'll look into  
that.

 It would probably be a good idea to validate the markup, too.
 http://validator.w3.org/check?verbose=1uri=http%3A%2F% 
 2Fwww.webanz.com%2Fwebanz_new%2Findex3.php

That's weird! I did this before posting my question! I validated both  
the html and the css and all validated fine!
Okay, I've just realised my mistake. I gave you an incorrect url!  
Nevertheless, the issues are the same and it is the same style sheet.

The correct URL is:
http://www.webanz.com/webanz_new/index4.php

...which validates fine: http://validator.w3.org/check?uri=http%3A%2F% 
2Fwww.webanz.com%2Fwebanz_new%2Findex4.phpcharset=%28detect 
+automatically%29doctype=Inlinegroup=0verbose=1user- 
agent=W3C_Validator%2F1.654

My apologies!

 I think your chances of getting that site functional in IE/5 is  
 slim to none.
Are you meaning, the structure of the site won't suit IE/5, or that  
IE/5 is beyond working with?

Thanks for your efforts to help!

Regards,
David

__
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] IE 6 layout issues

2009-05-14 Thread David Bailey

On 08/05/2009, at 3:51 AM, Alan Gresley wrote:

 David Laakso wrote:

 Alan,
 I wonder if he is referring to the white space beneath Tobias in
 compliant browsers in an 800 window, or in any width window when the
 fonts are scaled; and that this white space also appears beneath  
 Tobias
 in IE/8 and down, regardless of the widow width? In other words, is
 Tobias supposed to resting at the bottom bar regardless of window  
 size
 or user font preference?


 Oh I see now (not a IE6 bug). Thank you David.

 It's collapsing margins from the list at the bottom of the content.  
 They
 collapse through to div##rightColumn_hp since the image of Tobias is a
 float. The fix is to zero out that bottom margin.


 #rightColumn_hp ul {
   margin-bottom:0;
 }

Thanks for this. I used this to fix the gap between the image and the  
stripe at the bottom in IE. Can you explain what has happened here?  
There was obviously some inheritance issue that I'm not seeing; but  
I'd like to understand.

In the meantime, as suggested by a few others, I have used absolute  
positioning as others have suggested to solve the problem.

Thanks again for looking into this; I greatly appreciate not only the  
opportunity to solve the issues, but also to learn!

Regards,
David
__
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] IE 6 layout issues

2009-05-14 Thread David Bailey

On 15/05/2009, at 3:51 AM, Gunlaug Sørtun wrote:

 David Bailey wrote:
 Something I was unaware of was that you can float a div as well as  
 position it relatively!
 Relative positioning adds a few factors to the mix...

That all makes sense. Thanks for the explanation.

 Also included min-width fix for IE6, in case you want that.
  Is there anywhere I can find out an explanation of what you have  
 done here?
 See: http://www.gunlaug.no/contents/wd_additions_14.html

That's excellent. I've looked through and also bookmarked it. It  
certainly helps to make IE work as it does in FF and Safari. I guess  
the very fact we have to make special style sheets for IE in the  
first place shows we are having to take special steps to incorporate  
this ubiquitous but recalcitrant browser in its various versions, so  
I can see an argument for using MS's proprietary expressions when  
needed.


 The real problem I have with the menu bar in IE and the fact that  
 I have to stipulate a width for each menu item in pixels rather  
 than auto...
  this creates the problem of the menu bar dropping a line when the  
 window is narrowed or viewed at 800x600.

 In the 'menu_ie.css' stylesheet add/change to...
 ...and things will improve a bit at normal font size in IE6.
 The above works in IE6 because that browser has no respect for  
 declared
 dimensions and will expand the li until the content fits inside.  
 Usually
 that buggy behavior causes problems, bet here we're turning that  
 bug to
 our advantage.

That's excellent--almost the same as it appears in Safari! I can see  
what you have done using that IE bug. This is most helpful in seeing  
how to think in terms of what cards we've been dealt and turn it to  
good!

 resizing will cause drop at narrow width in all browsers, and  
 there's no
 use trying to avoid/prevent that.
Yes, I was aware and happy with that.  I'm personally happy with  
allowing menus to collapse, as ugly as that may at times look, but it  
does allow for resizing of text for readability. The site owner,  
however, didn't want the menu bar to collapse, hence the min-width,  
for which your work-around has suited well.

I am very grateful for the help I've received, and have learned a lot  
from this.

Regards,
David
__
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] IE 6 layout issues

2009-05-12 Thread David Bailey
 David Bailey wrote:
 Hi,

 I've got a couple of problems with IE 6 (and probably other versions,
 I don't have other IE browsers in order to check) which all work fine
 in Safari and FF. I've struggled with this for a few hours now, and
 looked for answers, but to no avail.



Tim, Georg, Alan, and David,

I've been away, hence no resonse to your comments!

Thanks for all your answers and suggestions and the effort you've put  
into working out suggested solutions. I'm most grateful.

A couple of the problems have been solved through Tim's earlier  
reply, but I've still got to work through the rest. Obviously, I've  
got to get to grips with this haslayout issue, and there's a few  
things to come to grips with along the way.

To those who mentioned the tobias image, yes, Tim's earlier reply  
provided the answer to why it sat above the content in IE.  
Nevertheless, as you have pointed out, I also had noticed that the  
image was separating from the maroon line at the bottom of the  
content area. It appears that absolute positioning should solve that,  
so I'll give that a go.

I'll come back and let you know how I've got on.

A big THANKS.

Regards,
David



__
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] IE 6 layout issues

2009-05-11 Thread David Bailey
Hi Tim and others,

Sorry I have not responded sooner, but have been away.

Thanks for the reply and helpful advice.


On 07/05/2009, at 10:49 AM, Tim Snadden wrote:


 1. Text content:
 The text drops down below the image on the right instead of being
 parallel to it. I'm sure I've seen something about this problem
 before in one of my books, but I can't find it for the life of me.

 The IE web developer toolbar is pale imitation of firebug but can  
 be used to find out what is happening in IE. If you look you will  
 see that the div class=hp_img is taking up with full width. You  
 could set a width on it, or do away with it altogether and just  
 position the image. I would absolutely position that image bottom  
 right so that even if the content grows he still looks right.
Thanks for that; that makes sense and works. I've downloaded the IE  
Web Developer toolbar too; that's great.

You're probably right about the absolute positioning. I see it moves  
when the window is narrowed. I'll give that a go.


 2. Stripes:
 The gray stripes under the navigation bar at the top and the bottom
 redish band at the bottom drops too low (the bottom one gets tangled
 with the footer text.

 .stripes {
 background:transparent url(/images/hor-stripes_bgtop.gif) repeat-x  
 left bottom;
 clear:both;
 height:26px;
 }
This has fixed it.

 You don't need the image inside that div.
That's true, if I make the image longer than the widest screen. I'll  
look at that.  I take it that this is better practice?

 Give the footer layout (google hasLayout) and the stripes will  
 position correctly. One way is using the proprietary 'zoom: 1; '
Hmm. I'll have to do a bit of study here and see how all that works.  
I've heard about it, but this is the first time I've really had a  
problem of this sort. Will check it out. Thanks.

 By the way - It would look much nicer to anti-alias the violin on  
 the left. It looks quite jaggy against the menu bar. You could do  
 it as an alpha transparent PNG and it would look better to everyone  
 but IE6 users, and to them it would look no worse than it does  
 currently.
I did use a PNG image at first, but Fireworks gave it a black edge  
which only emphasised the problem. I've done the same in Photoshop,  
which doesn't give it the edge, but still gets the halo. I may just  
start again with the original image and see if I can improve it. Thanks.

 Cheers, Tim

Much appreciated,
David

__
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] IE 6 layout issues

2009-05-05 Thread David Bailey
Hi,

I've got a couple of problems with IE 6 (and probably other versions,  
I don't have other IE browsers in order to check) which all work fine  
in Safari and FF. I've struggled with this for a few hours now, and  
looked for answers, but to no avail.

http://www.widemannviolins.com/index.php


1. Text content:
The text drops down below the image on the right instead of being  
parallel to it. I'm sure I've seen something about this problem  
before in one of my books, but I can't find it for the life of me.

2. Stripes:
The gray stripes under the navigation bar at the top and the bottom  
redish band at the bottom drops too low (the bottom one gets tangled  
with the footer text.

3. The Main Nav bar text:
I have used WebAssist's CSS MenuWriter for this (I thought it would  
save time!). I am having trouble getting this to work well.  
Apparently IE requires width and height to be declared rather than  
auto. Is there any way to get this looking like it does in Safari and  
FF?
It's got it's own its own stylesheet: http://www.widemannviolins.com/ 
CSSMenuWriter/cssmw/menu_ie.css

The main style sheet is: http://www.widemannviolins.com/styles/ 
layout.css


Any help is much appreciated,
David
__
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] footer float dl misbehaving

2007-09-28 Thread David Bailey
Hi,

I am having trouble with a footer that's not behaving the same in  
Safari and FireFox (Mac). I haven't been able to check it out in IE  
Win as my pc is not working at present.

http://www.dab-hand.co.nz/NZCFBS/3col.html
http://www.dab-hand.co.nz/NZCFBS/styles/main.css

The problem I'm having is with the footer and particularly with the  
left and right panels divided by a vertical stripe (border). The  
right-hand-column of text is a definition list.

1. If I float the right hand panel right and put a 20% right margin  
in order to move the text to the center of the right column:
Safari looks fine, and it behaves as I want it to
FF sends the text right over to the right, and the margin is very  
small—nothing like the margin on the left-hand-column, which I think  
is 15%.

2. If I float the right-hand-panel left and put a 20% margin on the  
left-hand-column in order to move the right-hand-column text to the  
center:
FF looks great
Safari drops the whole right-hand-column down under the left-hand-column

3. If I leave the right-hand-column to default (no float)
Both FF and Safari  the text is sitting in the right place, but it  
looses the structure of the definition list.

I am at a loss as to what is happening here, and all my experimenting  
is to no avail. Clearly, I am missing some vital point about css, but  
the fact that FF and Safari behave so differently is confusing me,  
and why I loose the dl structure when both browsers are consistent  
also baffles me. I'd hate to think what it does in IE 5, 6 and 7!

Help, guidance, advice—much appreciated.

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/


[css-d] missing image(s)

2006-11-30 Thread David Bailey
Hi,

At my client's request, I have added a javascript fade-in revolving  
image in the center column of the home page, but the image won't  
appear. I'm not sure for the reason for this, but I suspect is  
something I've done in the style sheet somewhere. Can anyone see what  
I've done wrong?

Page:
http://www.eurovisionltd.co.nz/index_3.php

CSS:
http://www.eurovisionltd.co.nz/styles/layout.css

The page is supposed to look like (although the images are different):
http://www.eurovisionltd.co.nz/index.php

Any suggestions would be appreciated!

David
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] missing image(s)

2006-11-30 Thread David Bailey
 At my client's request, I have added a javascript fade-in revolving
 image in the center column of the home page, but the image won't
 appear. I'm not sure for the reason for this, but I suspect is
 something I've done in the style sheet somewhere. Can anyone see what
 I've done wrong?

 Page:
 http://www.eurovisionltd.co.nz/index_3.php

 CSS:
 http://www.eurovisionltd.co.nz/styles/layout.css

 The page is supposed to look like (although the images are  
 different):
 http://www.eurovisionltd.co.nz/index.php

 Any suggestions would be appreciated!

Hi Ian,

 This may be a silly suggestion, but have you tested the code  
 without the
 javascript first and placing the image in where the revolving fade- 
 in should
 go?
No, that's not a silly question!  Well, perhaps it is if you were  
asking someone with more experience :-). I have done what you have  
said, and dropped out the javascript, and yes, the image appears  
(http://www.eurovisionltd.co.nz/index_4.php). That clearly indicates,  
as you have said, the problem lies with what I've done with the  
javascript. Okay, back to the drawing board—I'm not that up on js.


 I have a feeling that this is a Javascript issue. Hope the finished  
 article
 will have all the JS off page.
Yes, although, the original script is all done in the php.

I guess this makes this question now off-topic!

Thanks for your help!
David


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] missing image(s)

2006-11-30 Thread David Bailey
 Page:
 http://www.eurovisionltd.co.nz/index_3.php

 CSS:
 http://www.eurovisionltd.co.nz/styles/layout.css

 The page is supposed to look like (although the images are  
 different):
 http://www.eurovisionltd.co.nz/index.php

 Any suggestions would be appreciated!

 This may be a silly suggestion, but have you tested the code  
 without the
 javascript first and placing the image in where the revolving fade- 
 in should
 go?
 I have a feeling that this is a Javascript issue. Hope the  
 finished article
 will have all the JS off page.

 Whole bunch of CSS errors, and some Javascript errors, show up in FF
 Javascript console. You might check them out and see about fixing  
 them.

 HTML Validater also reports 26 errors:

 http://validator.w3.org/check?verbose=1uri=http%3A%2F% 
 2Fwww.eurovisionltd.co.nz%2Findex_3.php

 -- 
 David

Thanks David and Devon.

I should have checked all this out first; I didn't think to because  
the page did validated before adding the script from a third party  
(Dynamic Drive), which foolishly I just assumed that it would be valid 
—silly I know, and good lesson learnt.

I don't know enough about javascript to get this effect, so I'm  
reliant upon third party scripts. I'm a bit caught now, but then,  
this is not really a matter for this list, I guess. If anyone has got  
any suggestions off-list, I'd really appreciate it.

David
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] cascading problem with tables

2006-10-22 Thread David Bailey
Hi,

I'm having a problem with text size in a series of tables on one page.

The text on each page seems to get smaller on each table, especially  
with the list texts, and heightened with nested lists.

I have tried all sorts of things to try and remedy this, but  
something is escaping me. I'm not sure if it is something inherited  
or what.

http://www.eurovisionltd.co.nz/library_test_results.php

stylesheet:
http://www.eurovisionltd.co.nz/styles/layout.css

David

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] cascading problem with tables

2006-10-22 Thread David Bailey
Hi Philippe,

Thanks for your comments.

However, I'm not sure why you have made this comment (unless I'm  
missing something, which is quite possible), as the .resultTable li,  
li li selector is actually commented out (it was just an experiment,  
which I should delete). I am aware that the li li affects the  
nested li.

What amazes me is that each table in the series decreases in font size.

Regards
David



 I'm having a problem with text size in a series of tables on one  
 page.

 The text on each page seems to get smaller on each table, especially
 with the list texts, and heightened with nested lists.

 I have tried all sorts of things to try and remedy this, but
 something is escaping me. I'm not sure if it is something inherited
 or what.

 http://www.eurovisionltd.co.nz/library_test_results.php

 stylesheet:
 http://www.eurovisionltd.co.nz/styles/layout.css

  From your stylesheet:

 .resultTable td,{
   padding: 5px;
   font-size: .85em;
   line-height: 1.5em;
   color: #666;
 }
 /*
 .resultTable li, li li {
   margin: 0;
   font-size: .85em;
 }

 The td has .85em, then the li, **descendant** of the td, is again .
 85em, or .85em from .85em.

 BTW, I presume that, in the second selector above, your 'li li'
 applies to a li that is descendant of .resultTable. But yiu have
 the selector wrong. The way it is written now, that 'li li' means any
 li that is a descendant of a li. You have have various selectors like
 that.
 (and that also results in that progressively smaller font-size)


 Philippe
 ---
 Philippe Wittenbergh
 http://emps.l-c-n.com




 __
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 IE7 information -- http://css-discuss.incutio.com/?page=IE7
 List wiki/FAQ -- http://css-discuss.incutio.com/
 Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] background image problem in Firefox

2006-09-18 Thread David Bailey
Hi

I would appreciate help in finding out why I can't get the background  
image to display properly in Firefox (both Mac and Win). It renders  
fine in Safari and Opera (Mac) and in IE 6 (Win). If anyone is able  
to check it in IE 7 I'd appreciate that?

page:
http://www.dab-hand.co.nz/testbay/eurovision/index.php

css:
http://www.dab-hand.co.nz/testbay/eurovision/styles/layout.css

The css validates okay, but must be a FF quirk?

David
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] background image problem in Firefox

2006-09-18 Thread David Bailey
Hi Chris,

On 19/09/2006, at 12:08 PM, Chris Williams wrote:

 Hard to tell what image you are referring to.  The site looks the  
 same to me
 in Safari and FireFox on the Mac.
It is the pg_bkg_grfk.jpg (a door frame and handle that should angle  
down to the bottom of the page on the left hand side of the content  
area and finish just above the footer.

 Except of course the word architect is misspelled in both menus,  
 top and
 bottom :)
Thanks. I've been concentrating on layout, and not so much on the  
actual content.

David

 I would appreciate help in finding out why I can't get the background
 image to display properly in Firefox (both Mac and Win). It renders
 fine in Safari and Opera (Mac) and in IE 6 (Win). If anyone is able
 to check it in IE 7 I'd appreciate that?


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] background image problem in Firefox

2006-09-18 Thread David Bailey
Thanks David...


 I would appreciate help in finding out why I can't get the background
 image to display properly in Firefox (both Mac and Win). It renders
 fine in Safari and Opera (Mac) and in IE 6 (Win). If anyone is able
 to check it in IE 7 I'd appreciate that?
 page:
 http://www.dab-hand.co.nz/testbay/eurovision/index.php
 css:
 http://www.dab-hand.co.nz/testbay/eurovision/styles/layout.css

 XP
 This image *pg_bkg_grfk.jpg* is clipped in mozilla (only the top  
 36px of
 the image shows):
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.12) Gecko/ 
 20050915
 I do not know what is causing this.
Yes, I hadn't tried Mozilla, but you are right. Thanks for the other  
checks, too. This is the problem I'm asking the group as to what it  
could be. I'm really only a learner in CSS, and stumped as to what it  
could be.

 There seems to be no problem in these browsers (the page appears  
 identical)
 ie/6.0
 opera/9.01
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.7)
 Gecko/20060909 Firefox/1.5.0.7
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.4)
 Gecko/20060516 SeaMonkey/1.0.2

 aside: how come the 185px horizontal scroll bar at 1280 in all  
 browsers?
You are right. I hadn't even noticed that as I've always just worked  
within the window which which stretches to whatever size. I've been  
testing for users that may increase their font size. I'll have to  
have a look, but if anyone can see what the issue is, you are most  
welcome to let me know! :-)
David

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] background image problem in Firefox

2006-09-18 Thread David Bailey

 Hi

 I would appreciate help in finding out why I can't get the  
 background
 image to display properly in Firefox (both Mac and Win). It renders
 fine in Safari and Opera (Mac) and in IE 6 (Win). If anyone is able
 to check it in IE 7 I'd appreciate that?
 page:
 http://www.dab-hand.co.nz/testbay/eurovision/index.php
 css:
 http://www.dab-hand.co.nz/testbay/eurovision/styles/layout.css

 XP
 This image *pg_bkg_grfk.jpg* is clipped in mozilla (only the top  
 36px of
 the image shows):
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.12) Gecko/ 
 20050915
 I do not know what is causing this.

 There seems to be no problem in these browsers (the page appears  
 identical)
 ie/6.0
 opera/9.01
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.7)
 Gecko/20060909 Firefox/1.5.0.7
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.4)
 Gecko/20060516 SeaMonkey/1.0.2

 aside: how come the 185px horizontal scroll bar at 1280 in all  
 browsers?

 Regards,
 ~dL

 Hi David's,
 The horizontal scrollbar is due to the padding-left in the #content,
 which has also a {width: 100%;}.
 This is clipping the bg-img too, I think. A margin-left for the
 #content-left can solve it.
 The .separatorInvisible is not working in FF and others, because of  
 the
 { height: 0; }, then it is not present. You can give it a height of  
 1px
 and a negative margin-bottom of -1px, then the visual result is the
 same: no space is eaten.
 IMO it's not a FF quirk: with proper css FF is fine, and IE needs a
 correction. ;-)

 All together: see testpage
 http://home.tiscali.nl/developerscorner/css-discuss/test- 
 eurovision.htm.
 The results in some main browsers are savesound here in
 browsershots.org
 http://browsershots.org/screenshots/ 
 56a099e7c1e1881f3c2dc81b5bfc48e7/.
 :-)

 Greetings,
 francky

Hi Franky,

Thanks for all your effort! That is most helpful. I'll get to and  
apply your recommendations, which obviously work from your testpage.  
I also need to think about why these do what they do. For instance,  
why 100% width can't have padding, which I thought was possible as I  
understood padding to be internal content. I'll have to do a bit more  
reading!

You are no doubt right about FF. I shouldn't have assumed!

Thanks again for all your help!
David

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] background image problem in Firefox

2006-09-18 Thread David Bailey


 I would appreciate help in finding out why I can't get the background
 image to display properly in Firefox (both Mac and Win). It renders
 fine in Safari and Opera (Mac) and in IE 6 (Win). If anyone is able
 to check it in IE 7 I'd appreciate that?

 page:
 http://www.dab-hand.co.nz/testbay/eurovision/index.php


 Works fine in recent browsers: Safari 2.0, Firefox 1.5 and newer,  
 Opera 9.
 Older version(s) of Gecko (Firefox 1.0, Mozilla 1.7.13) have a  
 problem with clearing your floated blocks.
 Your div class=separatorInvisible isn't really clearing, because  
 it is empty, sort of.
 Add a non-breaking character in there, and it will work correctly
 div class=separatorInvisible#160;!-- x --/div

 (Or use another technique to contain your floats.)

Thanks, Philippe.
I have used this technique from a book i've been using (Web  
Designer's Reference, by Craig Grannell). He doesn't seem to us the  
non-breaking character in his sample. What other techniques are there  
to contain floats? Can you point me in the right direction?

David

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] Center alignment problem

2005-08-18 Thread David Bailey

I am having trouble with items aligning in the center of the page which I
can't find why. Of all things, it is working in IE win, but not in FF win
and Safari. 

Site: http://www.copyquality.co.nz
CSS: http://www.copyquality.co.nz/styles/main.css

Any help would be much appreciated.

David

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


Re: [css-d] Center alignment problem

2005-08-18 Thread David Bailey
Sorry, I didn't mention that it is the home page only. The table (dare I say
it!) in the center containing the javascript navigation buttons etc is what
is too far left. Everything else, from what I can see, is centered.

David

On 19/8/05 8:40 AM, CJ Larson [EMAIL PROTECTED] wrote:

 Other than the site map and the bottom left fixed graphic rendering
 differently, I don't see a center align in FF 1.0.6 that doesn't occur
 in IE 6.  Which specific items are you having problems with?
 
 -Original Message-
 I am having trouble with items aligning in the center of the page which
 I
 can't find why. Of all things, it is working in IE win, but not in FF
 win
 and Safari. 
 
 Site: http://www.copyquality.co.nz
 CSS: http://www.copyquality.co.nz/styles/main.css

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


Re: [css-d] dreamweaver mx -awful for css design

2005-08-15 Thread David Bailey
 
 [EMAIL PROTECTED] wrote:
 I hear studio 8 is meant to be a big improvement but WHY do my pages look all
 over the place in dreamwever and when I preview them in a browser ...perfect.
 
 This is so annoying...does anyone know of a good css extension or other
 visual application so I can see my DIV's as I build them?

 
 In some cases DW is worse than IE in its ability to render CSS I use DW
 MX2004 and it is slightly better than MX

Not only does DW not render the page correctly, but it keeps changing the
code. Recently I couldn't work out why a list generated navbar kept not
functioning correctly. I finally realised that DW was adding code, in fact
an extra li to the list (eg. liblah/lilili)!

I find that BBEdit is excellent (Mac). The only reason why I tend to stick
with DW is because of its imagemapping which is simple to use when needed,
and, I guess, its easy to use uploading features.

David

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


Re: [css-d] site check on a mac IE

2005-07-20 Thread David Bailey
Is there anyone that could do a site check on a mac IE for me?
 Apparently the site is 'not working' in mac IE.

Basically the header area has lost its formatting. I checked in Safari to
see what it should look like. The various items are all centered. This seems
to be a problem with Mac IE for some reason, and I've noticed a few on the
list who've had the problem, and would love to be put in the right direction
myself on this issue.

David

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


Re: [css-d] Navigation problems

2005-07-20 Thread David Bailey
 
 lia href=store.html id=firstlinkDigital Storefront/a/li
 
 #headernavbar #firstlink {border-left: 0;}
 
 Good.

Okay, the above (finally) worked when I sorted out the cascade matters! I
think that Rowan and Sean's ideas would have worked too, but haven't checked
them out yet having sorted out the cascade effect.

Great tutorial, Sean. Thanks for putting that up for me! I'd like to work
through it a bit more, although, I see I can download the files. Very
helpful markup.


Rowan:

Thanks for the suggestion on the line-height. It seems to have helped in
getting the bar height correct, but the text is still sitting at the top of
the bar.

David

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


[css-d] Positioning problem in IE Mac/ Disappearing problem IEWin

2005-07-16 Thread David Bailey
Hi,

This is my first foray into css positioning.

Problem 1: Positioning on IEMac 5.2

I have a problem with IE Mac not positioning correctly (or rather, as I
would like it!).

Please look at:
http://www.dab-hand.co.nz/testbay/copyquality/index.html
View Source for CSS (still in development stage; will link to a style sheet
once I've sorted all this out).

While I'm still playing around trying to get the main navigation graphic to
be in the center of the page and keep the footer below it, it is the header
section that is really having problems on IE Mac. Everything in the header
is centered in a line down the page. It shows okay in in Safari, FF and IE
Win as far as I can see. As I've said, I am new to this and learning as I
go, so if there is a better way to lay this out, let me know! My main
concern is to correct the problem in IE Mac.

(Sorry about the table for the central graphic in the content section, but I
have yet to figure out how to do this without adding to the graphics
download time. I'm sure that there is a way, but it seems quite complicated
in css. Any suggestions are welcome!)


Problem 2: Disappearing Background Problem in IEWin

http://www.dab-hand.co.nz/testbay/copyquality/services/pickup_delivery.html
View Source for the CSS

I have a graphic fixed bottom left of the page. This seems to show correctly
in all browsers that I have been able to check (IEMac, Safari, FF,), but it
doesn't appear at all in IEWin. What would be causing this problem, and what
would be the fix?

I would greatly appreciate any help I can get!

Thanks,
David



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