[css-d] Background image not appearing

[Dave M G]

CSS-d,

The web layout I'm discussing in this email has many problems, but 
within this thread, I just want to focus on one. So please be forgiving 
if you see other issues like PNG transparencies not displaying correctly 
or DIVs that are floating in strange places. I'll try to address those 
issues in separate threads.

Here I'd like to find out why my background image is not displaying 
correctly.

Please note that I have been away from making serious CSS layouts for a 
year or two, so I'm a little rusty. My level of understanding will vary 
a lot depending on what I remember, so I hope you will be patient with 
me if I have missed the obvious.

First, the design I'm aiming at making should look something like this 
preliminary design:
http://formever.org/site/default_style/target_design.png

But if you go here, to where the CSS is in action, you can easily see 
that it's quite different:
http://formever.org/css_test

Again, I just want to emphasize that despite all the problems, I just 
want to focus on one. That problem is the missing background on the 
folder images on the left hand side.

Just in case other people may see other things than what I'm seeing, I'm 
testing on FireFox version 2.0 on Linux. Here's what it looks like to me:
http://formever.org/site/default_style/myview.png
If you are using a different browser or platform in which the background 
images do display, then please let me know. Although in principle my 
intention is to make the design work on FireFox first, then other 
browsers later.

Anyway, the middle of the folder should be comprised of an image of 1 
pixel in height that repeats all the way down, to connect the top and 
bottom. But, as you can see, it is not displaying.

The image is on the server and can be accessed at:
http://formever.org/site/default_style/foldermiddle.png

I've included the relevant CSS code below. The background is specified 
in the #menus div declaration.

If someone could enlighten me as to why this image is not showing up, I 
would really appreciate it.

Thank you for any advice.

CSS Code:

/* Menus Container
#menus {
position:absolute;
top:150px;
left:20px;
width:154px;
line-height:17px;
/* Another IE Hack. */
voice-family: \}\;
voice-family:inherit;
width:150px;
}
/* Be nice to Opera 5 hack. */
body#Menu {width:150px;}
}

#menus div{
background-image: url(default_style/foldermiddle.png);
background-repeat: repeat-y;
margin-bottom: 16px;
}

#menus div::before {
display: block;
line-height: 0;
content:url(default_style/foldertop.png);
height: 30px;
max-width:154px;
}

#menus div::after {
display: block;
line-height: 0;
content: url(default_style/folderbottom.png);
}

#menus div ul{
list-style-type : none;
margin-left: 0;
margin: 0;
padding: 0;
list-style-image: none;
font-size:.75em;
}

-- 
Dave M G
Ubuntu 6.10 Edgy Eft
Kernel 2.6.20-5-generic
Pentium D Dual Core Processor
PHP 5, MySQL 5, Apache 2
__
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] Absolute position from within a DIV not being absolute

[Dave M G]

CSS-d,

As mentioned in another thread, the web layout I'm discussing in this 
email has many problems. But, again, I'll do one problem per thread.

So other issues aside, I'm having trouble making this one DIV position 
itself correctly within the web page.

And, again, my absence of about a year from CSS has made me rusty, so 
please forgive me where I've missed the obvious.

The design I'm aiming at making should look something like this 
preliminary design:
http://formever.org/site/default_style/target_design.png

I'm testing on FireFox version 2.0 on Linux. Here's what it looks like 
to me:
http://formever.org/site/default_style/myview.png

Here is where the CSS is in action:
http://formever.org/css_test

So, the trouble is this one DIV called #mainNavigation. If you look at 
the page, you'll see that it's over on the far left side, halfway off 
the page, and overlapping with one of the other menus.

I've specified the positioning of the #mainNavigation DIV to be 
absolute. I thought that meant it would break out of the DIV it was 
nested in and be positioned in absolute terms within the page. But it 
seems to be positioned relative to its container DIV, called #menus.

Why is it not floating over on the right hand of the screen?

Thank you for any advice.

CSS code:
#mainNavigation
{
position : absolute;
float : right;
clear : both;
right: 100px;
top : 120px;
}

#mainNavigation li{
display: inline;
}

-- 
Dave M G
Ubuntu 6.10 Edgy Eft
Kernel 2.6.20-5-generic
Pentium D Dual Core Processor
PHP 5, MySQL 5, Apache 2
__
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] Background image not appearing

[Gunlaug Sørtun]

Dave M G wrote:
 http://formever.org/css_test

I'd start here...
http://validator.w3.org/check?uri=http://formever.org/css_test
...since trying to correct anything with CSS in a document with that
many fatal source-code errors, is futile.

regards
Georg
-- 
http://www.gunlaug.no
__
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] does list-style-position actiually work

[Ross Hulford]

I tried ot on the li and ul

#content ul {
list-style:url(../images/li_flag.jpg);
list-style-position:60px 60px;
padding:20px;
}

can someone show me how?

R.
__
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] does list-style-position actiually work

[michael ensor]

- Original Message - 
From: Ross Hulford [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Tuesday, March 27, 2007 11:07 PM
Subject: [css-d] does list-style-position actiually work


: I tried ot on the li and ul
: 
: #content ul {
: list-style:url(../images/li_flag.jpg);
: list-style-position:60px 60px;
: padding:20px;
: }
: 
: can someone show me how?
: 
: R.

um, list-style-position has two values: inside, outside

are you thinking of margin-left etc or padding?


-- 
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.5.446 / Virus Database: 268.18.18/733 - Release Date: 25/03/07 11:07
__
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] does list-style-position actiually work

[Philippe Wittenbergh]

On Mar 27, 2007, at 8:07 PM, Ross Hulford wrote:

 I tried ot on the li and ul

 #content ul {
 list-style:url(../images/li_flag.jpg);
 list-style-position:60px 60px;
 padding:20px;
 }
Never a bad idea to ask here:
http://www.w3.org/TR/CSS21/generate.html#propdef-list-style-position

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/

Re: [css-d] does list-style-position actiually work

[Ross Hulford]

ok so it doesn't do what I thought it did.

I now revert back to background-image on the li

R.
- Original Message - 
From: Philippe Wittenbergh [EMAIL PROTECTED]
To: CSS-D css-d@lists.css-discuss.org
Sent: Tuesday, March 27, 2007 12:35 PM
Subject: Re: [css-d] does list-style-position actiually work


 
 On Mar 27, 2007, at 8:07 PM, Ross Hulford wrote:
 
 I tried ot on the li and ul

 #content ul {
 list-style:url(../images/li_flag.jpg);
 list-style-position:60px 60px;
 padding:20px;
 }
 Never a bad idea to ask here:
 http://www.w3.org/TR/CSS21/generate.html#propdef-list-style-position
 
 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] z-index issues

[Harlan]

Hi, I'm developing CSS tabs  subtabs, and having trouble with the subtabs.
I want to hide the rows of subtabs that are not currently active.  This
appears to work in Firefox (2.0.0.1) but fail in IE (7.0.x, and also in 6.x).


The page in question is here:
http://www.redmoonherbs.com/zz_test_harlan/classes.php

In IE you should see orange subtabs, with some unfortunate red subtabs
behind them, even though the red subtabs have a z-index of -1.

I think I have my stacking contexts wrong, but I can't figure out how to
make them right, as both the main tab ul and the subtab ul seem to
require a position: absolute AFAIKT (meaning that I am adapting these from
examples online, and I'm no CSS expert, any suggestions welcome!)

Thanks,
Harlan
__
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] I'm sure this is an easy problem...

[kan]

On 23/03/07, Michael Stevens [EMAIL PROTECTED] wrote:

 www.regencygarden.com/test/contact.html

 In IE the table looks good but in FF the cells are twice as tall as in IE.
 What's the easy fix for that? I thought it was a display: table or display:
 block applied to the table in the CSS but it's something else.
The default p style has big margins. FF displays them as expected
(IE should to do it too, but I don't know why it doesn't). Just remove
p in table cells.

-- 
WBR, kan.
__
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] Broken Layout in IE6 and Firefox 1.5

[KS]

Hi,

I'm working on my first site built entirely with CSS. I know my CSS
isn't perfect, but thought I was finally getting somewhere until I
viewed it on a PC running Windows XP with both the IE6 and FF1.5
browsers. I'm aware of the display issues in IE6, but was surprised as
to how bad they are. I've read about a number of fixes/hacks and am
not sure which is the best route to take. I'm also not sure if the
problem is IE or if my CSS is badly written. The site pages look
perfect on my Intel Mac running the most recent versions of FF and
Safari and on my PowerPC at work which runs OSX 10.3.9 and Safari and
FF. Here are the links to the home page and style sheet.

http://tang.skidmore.edu/oex/contexts/index.htm
http://tang.skidmore.edu/oex/contexts/styles.css

Any help or suggestions would be greatly appreciated.

Alp1776
__
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] XBrowser IE/FF: Formatting Issue

[Jeremy Campbell]

To save room in the list, please visit this link that I've setup, it
explains all of my woes:

http://www.ispotfilm.com/testfile.asp

Thanks in advance.
JC
__
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] change the background colour of a div or p on a mouse over hover?

[Maria Pesavento]

Hi everyone,
Is it posible to use css to add a mouse over hover to change the background
colour (not an image) of a div or p? Without there being any links to hook
on?

Thanks from an often confused table to div evolver.
Maria Pesavento
__
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] Div overlapping

[Dino CSS]

Hi All,

Is is possible to have two div tag overlap with each other ? If possible...
how can I achieve that ? I need to create 2 layout that host different
component.

Thanks,

Feris
__
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] Columns with div's : IE vs FF issue...

[Jeremy Campbell]

I'm having extreme difficulty with a test page I've recently created.  It
has to do with my CSS layout of the main body.  I've setup the link below to
illustrate what's happening.  If you open it in IE, it works perfectly fine
- however, if it's opened in FF, my left hand menu completely dissappears as
the main body section shifts completely to the left, regardless of the 130px
width it should be obeying.

http://www.ispotfilm.com/testfile.asp

I would greatly appreciate someone who knows more than I with CSS to assist.

Much obliged,
Jeremy
__
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] Eric Meyers Curvelicious

[Diane Michalski]

I am trying to modify Eric Meyer's demo site Curvelicious by changing the
color of the curve images. His example uses mht tmp files and I can't, for
the life of me, figure out how to generate these files.

I would really appreciate any help on this.

http://meyerweb.com/eric/css/edge/curvelicious/demo.html

Thanks,
-- 
Diane
__
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] font-size advice

[Stephen Jungels]

Greetings list,

I've learned a lot by starting to read this list recently and now am trying
my first question.  Thanks for any help you are able to provide.

After noticing that my site's text did not resize in IE 6 and reading some
messages here, I took the advice at
http://www.oliverhodgson.com/articles/friendlyfonts/ and used percentages
and ems to set my font sizes.

Now I find that everything looks as expected in Firefox.  In IE 6, the main
content font-size is a little too large.  In Opera, the sidebar font-size is
a little too small.  On the other hand, fonts resize nicely in IE, so there
is a definite improvement there.  I realize sometimes we have to accept
tradeoffs, but I solicit your advice:

1. Is this the best I can do or is there a way  to make all three browsers
look like Firefox?
2. For usability, is it more important  to  enable font-resizing in IE, or
to get the right size in all three browsers?
3. Any comments you may have about how it works in other browsers you may
try

I am a programmer moonlighting as a designer and relatively new to CSS, so I
know there may be stylistic issues already, but if you care to comment on
that that's fine.

The site: http://www.pithypedia.com/
The style sheet: http://www.pithypedia.com/style.css

Thanks!
__
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] Scrollbars inside a cell

[kan]

There is page which I cannot do that I want.
http://files.rsdn.ru/20380/tc.html
I want make scrollbars appear inside the Content box. Footer should
always be at the bottom of window. Content box should take all
available space, the browser window must not have scrollbars.
I've made it by tables, but if somebody has the same layout with divs,
it would be great.

-- 
WBR, kan.
__
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] screen area detection/alt style sheets

[n h]

Hi, I'm new to the list and am looking for some
(hopefully simple) javascript that detects the browser
window width and then delivers one style sheet for
window widths 900 px and smaller, and another style
sheet for screens wider than 900 px (or whatever
measurements are entered into the script). 

I searched through the archives and found a thread on
this that had a link from HTH-Mike to a script that
sounds like it is what I'm looking for, but the link
doesn't work anymore: 

I have a script that checks the window width, then
serves up appropriate css for the monitor width. I
design for 800x600, but have a backup css
for 640x480.

Instructions are located on a very colorful (ie ugly)
page here:
http://www.masadelante.com/css/template1JavaTest.htm;

I'm hoping that someone has this script available
somewhere else and could send me the link to it, or
could post it here. 

thanks very much,
shelly



 

It's here! Your new message!  
Get new email alerts with the free Yahoo! Toolbar.
http://tools.search.yahoo.com/toolbar/features/mail/
__
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] problems with IE5

[Piotr Miczko]

Hi! 
My name is Peter. I'm writing from Poland.
I'v created my school's web-pages with CSS. It works well in all browsers but 
IE5.
There are three problems:

1) element div id=main is getting narrow till ca 80%.
2) all content of div id=technikumb iv vanishing.
3) left navigation elements don't fill whole div id=lewa.

this is the address: http://www.zsb.kalisz.pl

and css file: http://www.zsb.kalisz.pl/arkusze/elastyczny.css
 and: http://www.zsb.kalisz.pl/arkusze/elastyczny1.css

I've tried many things but couldn't fix it.

I'm looking forward for your respose.

thank you.
__
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] [WD]: 3 columns, fixed left, fluid middle and right?

[david]

Owen Leonard wrote:
 I've been scratching my head over this one, and could really use some help.
 I want to create a region inside a web page that uses a three-column
 layout, with a fixed left column and fluid middle and right. Here's a
 visual aid:
 
 http://zivotdesign.com/examples/layout.gif

Have you looked at Layout Gala?

http://blog.html.it/layoutgala/

-- 
David
[EMAIL PROTECTED]
authenticity, honesty, community
__
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] change the background colour of a div or p on a mouse over hover?

[Jukka K. Korpela]

On Sat, 24 Mar 2007, Maria Pesavento wrote:

 Is it posible to use css to add a mouse over hover to change the background
 colour (not an image) of a div or p? Without there being any links to hook
 on?

Yes, using the :hover pseudoelement, e.g.

p:hover { background: #ffe; color: black; }

However, IE 6 doesn't support this; IE 7 does.

Sometimes people use tricks that avoid the IE 6 limitation, e.g. by using 
markup like pa href=../a/p and then setting the desired 
properties for a:hover and trying to make the a look like normal 
paragraph with no link-like presentation or behavior. Needless to say, 
this is messy and unreliable. If you wish to cover IE 6, it's probably 
best to use a piece of JavaScript (even though this will of course fail 
when JavaScript is disabled).

-- 
Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/

__
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] Background image not appearing

[Dave M G]

Gunlaug,

Thank you for replying.

Sorry, sometimes the PHP script gets changed on me, and I forgot to 
ensure it was valid before bringing my issues here. I should have checked.

In any case, I have seen to it that the errors are corrected and my 
XHMTL now validates.

The errors I have described are still there after ensuring the code is 
valid.

Will it be possible now to get some advice on where I am going wrong 
with the CSS?

(PS: The CSS validator shows five errors, but they may be related to the 
very reasons I'm posting here.)

-- 
Dave M G
Ubuntu 6.10 Edgy Eft
Kernel 2.6.20-5-generic
Pentium D Dual Core Processor
PHP 5, MySQL 5, Apache 2

__
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] font-size advice

[Jukka K. Korpela]

On Sun, 25 Mar 2007, Stephen Jungels wrote:

 Now I find that everything looks as expected in Firefox.  In IE 6, the main
 content font-size is a little too large.

It depends on matters of taste and eyesight etc. whether it is too large, 
but it's definitely larger than on Firefox, with factory settings. The 
reason is that you use sizes that are ultimately relative to the 
browser's basic font size. That size is smaller on Firefox than on IE, in 
typical conditions.

The variation is more or less a basic feature of the approach you have 
used; it's not an undesired side effect but part of the goal.

 1. Is this the best I can do or is there a way  to make all three browsers
 look like Firefox?

You can set body { font-size: 15px; }, but then you are taking a different 
approach entirely.

 2. For usability, is it more important  to  enable font-resizing in IE, or
 to get the right size in all three browsers?

I'm afraid that question has been discussed to death in this list and 
elsewhere. I'd say you just have to decide between usability and right 
size, since usability means that there is no right size.

If you want a default font size in pixels (the right size) _and_ font 
scalability on IE (i.e., let users override the right size), then the 
practical approach is probably the inclusion of some scripting 
(client-side or server-side) that lets the user change the font size by 
clicking on a button, for example. It's not easy, though, since to be 
convenient, it would have to work using server-side scripting and cookies 
so that the user only needs to set the font size _once_ for the site.

-- 
Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/

__
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] perfect font sizes- any sample solutions?

[Felix Miata]

On 2007/03/27 08:18 (GMT+0300) Jukka K. Korpela apparently typed:

 On Mon, 26 Mar 2007, Felix Miata wrote:

 To be clear, all IE versions default not to Xpx, but to 12pt. The M$ factory
 default DPI is 96, which translates 12pt to 16px.

 I think it needs to be added that this correspondence (or some other 
 correspondence that has been chosen) does not change when the monitor 
 resolution is changed. Thus, if a user chooses a different resolution
 among the available options, 12pt will still be 16px. This means that pt 
 will not match its definition any more; it will be different from the 
 typographic point. Similarly, mm will be different from the physical 
 millimeter and in different from the inch.

 The point (no pun intended) is that the physical units aren't really 
 physical in all circumstances. Setting (or defaulting) something to 12pt 
 may make it physically 12 typographic points in most circumstances, but 
 not all.

I was remiss in my previous reply leaving out this important point about the
error characteristic of pt and the other CSS physicial units.
Traditionally on M$ systems at least the relationship between these
purported physical units and real physical measurements has been awful. Back
when 640x480 was normal and 13 nominal/12 actual displays were also
typical, the 96 DPI assumption made 12pt, and thus 16px, produce a 12pt font
that was approximately 17.3pt in physical size. The better systems of
those days running 800x600 on 14 nominal/13 actual displays did slightly
better at about 15.0pt. As things evolved to 1024x768 on 17 nominal/16
actual a further small improvement was made to about 14.4pt.

The previous paragraph describes the apparent basis for a couple of web
developer traditions:

1-the defaults are too big
2-physical units like pt should not be used for sizing text via CSS

I believe the second item above remains a good recommendation, but with the
continued increase in display sizes and resolution, the first has evolved
into a bad assumption. On a current entry level 15 1024x768 flat panel
display the actual size of 12pt/16px has dropped to 13.5pt. At one step up
to 1280x1024 on 17, the error is down to 0.1pt at 11.9pt actual for 12pt/16px.

For widescreen laptops, which have been outselling desktops for some time
now, the error shift is more pronounced. At entry level WXGA (1280x800)
15.4 12pt/16px is 11.8pt. Some upgrades are 11.5pt on WXGA+ (1440x900) 17,
9.9pt on WSXGA+ (1680x1050) 18, and 9.7pt on WUXGA (1920x1200) 19. These
examples and other combinations can be found on
http://mrmazda.no-ip.com/auth/Font/fonts-pt2px-tabled.html.

This error shift to negative has resulted in laptop manufacturers setting
the system DPI instead of the M$ 96 nominal default to 120. This generally
keeps the IE 12pt default reasonably close to 12pt actual, but is of no help
to Gecko browser users (whose defaults are OEM specified in px) or when CSS
has specified font sizes in px. The 16px default on average is
considerably smaller than it used to be, and, on average, probably anything
but too big any more for normal people.
http://mrmazda.no-ip.com/auth/bigdefaults.html
-- 
For God did not send his Son into the world to condemn the
world, but to save the world through him.  John 3:17 NIV

 Team OS/2 ** Reg. Linux User #211409

Felix Miata  ***  http://mrmazda.no-ip.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/

Re: [css-d] change the background colour of a div or p on a mouse over hover?

[Shelly]

 Is it posible to use css to add a mouse over hover to change the 
background colour (not an image) of a div or p? Without there being any 
links to hook on?

Yes, but it requires some scripting to do so.  I had a client that 
really needed this to happen and it worked very well.  I can't remember 
where I found this, so I'm sorry for not crediting the author...

But create your div using CSS as you normally would.  In the header of 
your file, you add this:

   style type=text/css
body {behavior:url(divhover.htc);}
   /style

The divhover.htc looks like so... EDIT: whoops - it's pretty big, so 
I'm not going to put it here! However, the script *did* have the uRL 
where I got it (so I guess a credit *does* go back!): 
http://www.xs4all.nl/~peterned/

Worked like a charm (and validated).  Hope that helps you out.

~Shelly

__
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] font-size advice

[Chris Ovenden]

 I'm afraid that question has been discussed to death in this list and
 elsewhere. I'd say you just have to decide between usability and right
 size, since usability means that there is no right size.


Surely the right size, or a t least the right initial size, is the
same size as (most) other sites. By using body { font-size:100% } or
similar, you're immediately making your fonts annoyingly large
compared to the majority who use something like body { font-size:76% }
 - a de facto 'standard' for good reason:

http://www.thenoodleincident.com/tutorials/box_lesson/font/

-- 
Chris Ovenden

http://frontend.blogsome.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/

Re: [css-d] font-size advice

[jeffrey morin]

On 3/27/07, Chris Ovenden [EMAIL PROTECTED] wrote:

 
  I'm afraid that question has been discussed to death in this list and
  elsewhere. I'd say you just have to decide between usability and
 right
  size, since usability means that there is no right size.
 

 Surely the right size, or a t least the right initial size, is the
 same size as (most) other sites. By using body { font-size:100% } or
 similar, you're immediately making your fonts annoyingly large
 compared to the majority who use something like body { font-size:76% }
 - a de facto 'standard' for good reason:

 http://www.thenoodleincident.com/tutorials/box_lesson/font/

 --
 Chris Ovenden

 hello all,


just wanted to chime in and also add a question of my own here. i usually
wet body {font-size: 62.5%} so then when you size with ems 1.2 ems =12px and
so on. this seems to work for me but last week i had posted a site on here
and was told that with windows set at 120DPI that Opera was increasing the
font size by 25%. i prefer using ems to px but don't want my sites to look
out of wack on high res monitors. is there any solution to this?

Thanks,
Jeff
__
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] font-size advice

[Felix Miata]

On 2007/03/25 23:42 (GMT-0400) Stephen Jungels apparently typed:

[this post arrived here only moments ago]

 I've learned a lot by starting to read this list recently and now am trying
 my first question.  Thanks for any help you are able to provide.

 After noticing that my site's text did not resize in IE 6 and reading some
 messages here, I took the advice at
 http://www.oliverhodgson.com/articles/friendlyfonts/ and used percentages
 and ems to set my font sizes.

 Now I find that everything looks as expected in Firefox.  In IE 6, the main
 content font-size is a little too large.  In Opera, the sidebar font-size is
 a little too small.  On the other hand, fonts resize nicely in IE, so there
 is a definite improvement there.  I realize sometimes we have to accept
 tradeoffs, but I solicit your advice:

 1. Is this the best I can do or is there a way  to make all three browsers
 look like Firefox?

You can't fully do that and at the same time have a user friendly, fully
accessible page.

 2. For usability, is it more important  to  enable font-resizing in IE, or
 to get the right size in all three browsers?

Only the visitor can determine the right size, so enabling font resizing
by avoiding px and physical CSS units for font sizing is the right thing to do.

 3. Any comments you may have about how it works in other browsers you may
 try

I see no apparent difference between IE and FF here. FF here has the same
effective default font size as IE, which is both 12pt and 16px. That
matching is the effect of the M$ default system DPI setting, which is the
determinant of the relationship between pt sizes and px sizes.

If you are seeing a difference it is likely the result of your use of a
modern system, likely a laptop, on which the system DPI setting is 120
(called large fonts) rather than 96 (normal fonts on WinXP). That DPI
difference increases the size of IE's 12pt default from 16px to 20px, while
leaving FF's 16px untouched.

The other common reason for differences between IE and FF stems from your
use of a doctype that puts modern browsers into quirks rendering mode. All
new pages should be created using a doctype that puts browsers into
standards compliance mode in order to minimize rendering differences among
different browsers.
http://developer.mozilla.org/en/docs/Mozilla's_DOCTYPE_sniffing
http://gutfeldt.ch/matthias/articles/doctypeswitch.html

So, the thing to do is accept that the page will not look the same in all
viewing environments. Strive to ensure that it remains fully functional in a
wide range of environments, and be content with mere similarity as user
environments deviate from yours.

 I am a programmer moonlighting as a designer and relatively new to CSS, so I
 know there may be stylistic issues already, but if you care to comment on
 that that's fine.

 The site: http://www.pithypedia.com/
 The style sheet: http://www.pithypedia.com/style.css

I like it. :-)
-- 
For God did not send his Son into the world to condemn the
world, but to save the world through him.  John 3:17 NIV

 Team OS/2 ** Reg. Linux User #211409

Felix Miata  ***  http://mrmazda.no-ip.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/

Re: [css-d] font-size advice

[Rick Pasotto]

On Tue, Mar 27, 2007 at 02:28:33PM +0100, Chris Ovenden wrote:
 
  I'm afraid that question has been discussed to death in this list
  and elsewhere. I'd say you just have to decide between usability
  and right size, since usability means that there is no right size.
 
 Surely the right size, or a t least the right initial size, is the
 same size as (most) other sites.

Wrong. Truth is *not* determined by majority vote.

 By using body { font-size:100% } or similar,

You are giving the user what the user finds most comfortable to read.

 you're immediately making your fonts annoyingly large compared to the
 majority who use something like body { font-size:76% } - a de facto
 'standard' for good reason:

Nonsense like that is why I have to increase the displayed font size
(sometimes *twice*) on 90+% of the sites I visit in order to be able to
read them. That is most definitely *not* user friendly.

The web is *not* print. The rules are different. Do not expect your
pages to look exactly the same on all displays. You can't even be sure
that your selected font is available and different fonts have different
base sizes, a fact that could very easily throw off all your careful
calculations.

-- 
If you will not fight for right when you can easily win without blood
 shed; if you will not fight when your victory is sure and not too
 costly; you may come to the moment when you will have to fight with
 all the odds against you and only a precarious chance of survival.
 There may even be a worse case. You may have to fight when there is no
 hope of victory, because it is better to perish than to live as
 slaves. -- Winston Churchill
Rick Pasotto[EMAIL PROTECTED]http://www.niof.net
__
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] The Incredible Disappearing Scroll Arrow

[Adrian Williams]

Y'all,

I have been working on getting my CSS-based scrolling table working 
correctly in IE 7 and am REALLY close...

http://williams.genealogy.fm/results_page.php

The problem I have is that in IE7 the upper scroll bar arrow is 
being tucked underneath the fixed header and is invisible.  It's correct 
in FF and IE6.  I understand that the disappearing act is due to the 
fact that the scroll bar is being added to the right edge of the 
containing element and the fixed nature of the header is overriding 
this, but I need to know if there is a way to fix this w/out jacking up 
the rendering in FF and IE6?

Adrian
__
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] Background image not appearing

[Gunlaug Sørtun]

Dave M G wrote:
 Will it be possible now to get some advice on where I am going wrong 
 with the CSS?

Definitely :-)

One stray '}' creates a parse-error, so the next rule - which happens to
be .linklist isn't read by browsers.

 (PS: The CSS validator shows five errors, but they may be related to 
 the very reasons I'm posting here.)

Yes, they are.
- 4 CSS3 properties - ok - validates as CSS3.
- 1 parse error - not ok - and is the cause of your problem.

regards
Georg
-- 
http://www.gunlaug.no
__
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] Broken Layout in IE6 and Firefox 1.5

[Gunlaug Sørtun]

KS wrote:
 [...]I'm aware of the display issues in IE6, but was surprised as to
  how bad they are. I've read about a number of fixes/hacks and am not
  sure which is the best route to take.

I recommend avoid hacks if you can - apply only those you understand if
you must.

 I'm also not sure if the problem is IE or if my CSS is badly written.

It's _all_ IE6' fault :-)

 http://tang.skidmore.edu/oex/contexts/index.htm

Add...

#menu {display: inline;}

...to fix the 'margin-doubling on floats'[1] bug in IE6.

Then add...

* html #container {overflow-x: hidden;}

...to make IE6 trim back the last few pixels caused by its
'auto-expansion'[2] bug.


While you're at it ... it might also be a good idea to fix IE/win's 'em
font-resizing'[3] bug.

Adding...

html {font-size: 100%;}

...will do.


regards
Georg

[1]http://www.positioniseverything.net/explorer/doubled-margin.html
[2]http://www.positioniseverything.net/explorer/expandingboxbug.html
[3]http://www.gunlaug.no/contents/wd_additions_13.html
-- 
http://www.gunlaug.no
__
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] The Incredible Disappearing Scroll Arrow

[cj]

these aren't exactly answers to your questions, but i wanted to let
you know some thing i noticed about your page.


i like to cram a lot of windows on my screen at once, so my browser is
almost never more than 700 to 800px wide, which made your whole page
scroll horizontally for me.  to read the matched group results
section, i have to scroll left and right and was losing my place.  to
read your table, i have to scroll left and right as well, and when i
want to scroll down, i have to go back to the right to get to the
scroll bar (assuming i wouldn't use the mouse scrolling).

i also have a monitor size of 1856x1392 and your text was getting on
the small side.  ;)  resizing the text larger in firefox made the
right side of the table start to disappear, and the scroll bar went
poof altogether.  i couldn't resize the text larger in ie at all.

i'm not sure if these type of usability problem fit into your design
plan, but the page was a pain for me and i figured i'd pass it along.
__
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] [ADMIN WARNING] font-size advice

[Bob Easton]

We are treading on the edge of civility with exclamations like wrong 
and nonsense.  This topic has been covered dozens of times on this 
list and too often wanders into downright argument based on opinion and 
personal preferences.

Warning to all: contribute factual, technical information about CSS 
techniques, or stay out of the discussion.

For others: visit the archives and the WIKI where you will find a huge 
amount of material already.  Little has changed in browsers since that 
material was contributed, so you're not missing any late breaking news 
by reading what has already been written.  Links at the bottom of every 
post.

Rick Pasotto wrote:
 On Tue, Mar 27, 2007 at 02:28:33PM +0100, Chris Ovenden wrote:
 I'm afraid that question has been discussed to death in this list
 and elsewhere. I'd say you just have to decide between usability
 and right size, since usability means that there is no right size.
 Surely the right size, or a t least the right initial size, is the
 same size as (most) other sites.
 
 Wrong. Truth is *not* determined by majority vote.
 
 By using body { font-size:100% } or similar,
 
 You are giving the user what the user finds most comfortable to read.
 
 you're immediately making your fonts annoyingly large compared to the
 majority who use something like body { font-size:76% } - a de facto
 'standard' for good reason:
 
 Nonsense like that is why I have to increase the displayed font size
 (sometimes *twice*) on 90+% of the sites I visit in order to be able to
 read them. That is most definitely *not* user friendly.
 
 The web is *not* print. The rules are different. Do not expect your
 pages to look exactly the same on all displays. You can't even be sure
 that your selected font is available and different fonts have different
 base sizes, a fact that could very easily throw off all your careful
 calculations.
 


-- 
Bob Easton
Accessibility Matters: http://access-matters.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/

Re: [css-d] font-size advice

[Felix Miata]

On 2007/03/27 14:28 (GMT+0100) Chris Ovenden apparently typed:

 the majority who use something like body { font-size:76% }
  - a de facto 'standard' for good reason:

That standard was formulated over a decade ago, when CSS1 was in
gestation, for the environmental realities of yesteryear. Good reason for
it is long obsolete, as explained in my replies to today's other font thread
perfect font sizes- any sample solutions? and at
http://mrmazda.no-ip.com/auth/bigdefaults.html with related material at
http://www.informationarchitects.jp/100e2r?v=4 .
-- 
For God did not send his Son into the world to condemn the
world, but to save the world through him.  John 3:17 NIV

 Team OS/2 ** Reg. Linux User #211409

Felix Miata  ***  http://mrmazda.no-ip.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-d] Diagnosis needed for IE6 strange positioning and invisible objects

[Barney Carroll]

Hi list,

Made the terrible mistake of working without IE6 checkups for a day. The 
result is very confusing:

http://proforest.test.textmatters.com

First of all, the paragraphs for the 4 sections (with header and image) 
in the main column don't slot into place as they do with all the other 
browsers. I can't work out why they insist on clearing the images.

Second, below the two pictures at the top of the right-hand column 
should (and do) have a couple of paragraphs of text underneath them, but 
IE6 is making them invisible.

I cannot for the life of me work out what might be causing these 
anomalies. Any ideas?


Regards,
Barney
__
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] font-size advice

[Chris Ovenden]

On 3/27/07, Rick Pasotto [EMAIL PROTECTED] wrote:
 On Tue, Mar 27, 2007 at 02:28:33PM +0100, Chris Ovenden wrote:
  
   I'm afraid that question has been discussed to death in this list
   and elsewhere. I'd say you just have to decide between usability
   and right size, since usability means that there is no right size.
 
  Surely the right size, or a t least the right initial size, is the
  same size as (most) other sites.

 Wrong. Truth is *not* determined by majority vote.

Who said anything about Truth (capitalization an' all)?

  By using body { font-size:100% } or similar,

 You are giving the user what the user finds most comfortable to read.

  you're immediately making your fonts annoyingly large compared to the
  majority who use something like body { font-size:76% } - a de facto
  'standard' for good reason:

 Nonsense like that is why I have to increase the displayed font size
 (sometimes *twice*) on 90+% of the sites I visit in order to be able to
 read them. That is most definitely *not* user friendly.

I think you just proved my point. The world wide web is just that - a
bunch of connected things, of which any particular website is but one.
If you have to change the font size  for 90% of the sites you visit,
then you have your browser set up wrongly.

-- 
Chris Ovenden

http://thepeer.blogspot.com
Imagine all the people / Sharing all the world
__
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] Diagnosis needed for IE6 strange positioning and invisible objects

[~davidLaakso]

Barney Carroll wrote:
 Hi list,

 Made the terrible mistake of working without IE6 checkups for a day. The 
 result is very confusing:

 http://proforest.test.textmatters.com




 Regards,
 Barney

   
First place to look may be to validate the markup. Might not solve much 
but always a good idea in problem solving.
Regards,
~dL

-- 
http://chelseacreekstudio.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/

Re: [css-d] Diagnosis needed for IE6 strange positioning and invisible objects

[Barney Carroll]

~davidLaakso wrote:
  First place to look may be to validate the markup. Might not solve much
  but always a good idea in problem solving.
  Regards,
  ~dL


Good advice, David. My firebug and web developer had told me the page 
/was/ completely valid, but w3's validator argues. For reasons 
absolutely beyond my ken, it is telling me certain ps and divs are 
not 'expected', and should instead be objects... Utterly bizarre.

I'll try and get my head around that at some point, but for the case in 
point I believe it's sufficient to know that everything is behaving in 
standards compliant mode, or as close as they can get.


Regards,
Barney
__
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] font-size advice

[Stephen Jungels]

Thanks for the good discusssion.  I didn't anticipate that a question about
font sizes would start such a lively discussion ;)

Since I am including people with vision impairment in my target audience,
it's important to enable font resizing in as many browsers as possible.  So
I will stick with relative font sizing and tweak the sizes a little.
__
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] Broken Layout in IE6 and Firefox 1.5

[KS]

 Add...

 #menu {display: inline;}

 ...to fix the 'margin-doubling on floats'[1] bug in IE6.


OMG!

Thank you Gunlaug.

It's almost fixed. I think I can get the right column fixed on my own.
As for the menu bar it needs to be lined up vertically with the title
Contexts Writing in the Museum and horizontally between the title
and the logo Tang. The code I'm using is this:

#menu {
margin: 16px 0 0 378px;
width: 390px;
float: left;
   display: inline;
}

If I change the margins to work with IE6 on the PC then it will
display the menu incorrectly on FF for PC and on Safari and FF for
Mac.

Also, on the Objects page the bar at the bottom of the page does not
lign up with the right edge of the images on the farthest right.

Any suggestions on how to fix these last display issues?

Oh, and I had to switch servers for development. The new links are:

http://www.karaspellman.com/dev/tang/NEW/index.htm
http://www.karaspellman.com/dev/tang/NEW/styles.css

Thanks,
Alp1776
__
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] font-size advice

[kdavis]

I just wanted to add a link to an article which was posted by Ed 
Seehouse on the
previous thread perfect font sizes- any sample solutions?-

http://pages.prodigy.net/chris_beall/TC/
  (then choose Font size from the list on that page)

It sums up well, I thought, and in clear, simple language I could understand,
what seemed to be a partial consensus from that thread (percentages, set no
base font/ or set 100%)
__
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] font-size advice

[grovesdavid]

Good evening to All,

I think maybe we should now all accept the warning, and not force the 
intervention of a moderator.

I would say this, on this subject. Besides what has been written here, what 
I've been told privately and what I have managed to find on the web, (some 
going back as far, as 2003).

It seems reasonable for anyone considering asking the question, what is the 
optimum font size for my website (or however they word it).

The answer is No such animal exists. If what you've designed has satisfied 
you're client, and his site visitors then I guess it's right. If not I guess 
it's wrong.

There are no definitive answers to anything on the web, there will always be 
an exception to any rule we care to make, that's what we have to live with, 
and work with. So lets all accept it and move on..

Agree or not 'Georg?'

I've learned a lot over the last ten days, now have to start all over 
again..


DG)
 

__
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] Diagnosis needed for IE6 strange positioning and invisible objects

[Gunlaug Sørtun]

Barney Carroll wrote:

 http://proforest.test.textmatters.com
 
 First of all, the paragraphs for the 4 sections (with header and
 image) in the main column don't slot into place as they do with all
 the other browsers. I can't work out why they insist on clearing the
 images.

They don't. Instead IE6 is expanding those h2 to contain the images, so
there's no room for those paragraphs to slot into.

To see what's going on, add background...

#mainText h2 {background: red;}

...and to fix in IE6, add...

#mainText h2 {height: auto;}

...to reset the existing 'hasLayout' trigger to off.

 Second, below the two pictures at the top of the right-hand column 
 should (and do) have a couple of paragraphs of text underneath them,
 but IE6 is making them invisible.

Tell IE6 that those elements have 'Layout'...

#newsinner p {zoom: 1;}

...and things will improve

regards
Georg
-- 
http://www.gunlaug.no
__
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] Rollovers (hovers) not working in Firefox

[Kathi Cushman]

Hi all,

First of all, I'm fairly new to CSS and taking over for my partner, so 
there's probably a better way of doing things than the method I'm using.

On this page, my hovers for the horizontal bar of main navs doesn't work in 
Firefox, except for the first 3. I used the same code for another site that 
used horizontal navs and worked fine in all browsers. For the life of me, I 
can't seem to figure this out.

http://www.igryphon.com/microtia_final/age-to-begin.html

On a side note, the horizontal nav bar is made up of one horizontal div, 
then individual divs nested in it for each nav button. I would rather 
have had the buttons all in the one larger div, but I couldn't get them to 
display in a row, even when I changed display: block to display: inline.

If you have any input I'd sure appreciate it.


__
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] IE Transparent PNG Background (that repeats)

[BJ Clark]

Hello List,
Anyone out there know of a fix for IE that allows repeating (repeat-x
or repeat-y) transparent PNG background images?

I have attempted to use the bgsleight hack, but that doesn't seem to
allow repeating bg's.

Thanks in advance,
BJ Clark
The Science Department
__
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] Rollovers (hovers) not working in Firefox

[Scott Povlot]

Kathi,

The problem is related to the absolute positioned title that is blocking the 
menu items.

Here is the CSS fix that changes the title to relative positioning.

#pagetitle_ma
{
left:250px;
position:relative;
top:120px;
width:540px;
}


Regards,

Scott Povlot

- Original Message 
From: Kathi Cushman [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Tuesday, March 27, 2007 3:35:38 PM
Subject: [css-d] Rollovers (hovers) not working in Firefox

Hi all,

First of all, I'm fairly new to CSS and taking over for my partner, so 
there's probably a better way of doing things than the method I'm using.

On this page, my hovers for the horizontal bar of main navs doesn't work in 
Firefox, except for the first 3. I used the same code for another site that 
used horizontal navs and worked fine in all browsers. For the life of me, I 
can't seem to figure this out.

http://www.igryphon.com/microtia_final/age-to-begin.html

On a side note, the horizontal nav bar is made up of one horizontal div, 
then individual divs nested in it for each nav button. I would rather 
have had the buttons all in the one larger div, but I couldn't get them to 
display in a row, even when I changed display: block to display: inline.

If you have any input I'd sure appreciate it.


__
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/







 

Finding fabulous fares is fun.  
Let Yahoo! FareChase search your favorite travel sites to find flight and hotel 
bargains.
http://farechase.yahoo.com/promo-generic-14795097
__
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] Rollovers (hovers) not working in Firefox

[Brian Cummiskey]

Kathi Cushman wrote:
 http://www.igryphon.com/microtia_final/age-to-begin.html
   
Kathi,
you do have some markup errors:

http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.igryphon.com%2Fmicrotia_final%2Fage-to-begin.html

Those may be contributing to it.
 On a side note, the horizontal nav bar is made up of one horizontal div, 
 then individual divs nested in it for each nav button. I would rather 
 have had the buttons all in the one larger div, but I couldn't get them to 
 display in a row, even when I changed display: block to display: inline.
   
The best option for navs is a LIST.

Check out this site for examples:

http://css.maxdesign.com.au/listamatic/
__
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] Rollovers (hovers) not working in Firefox

[Glenn E. Lanier, II]

 -Original Message-
 From: Kathi Cushman
 Sent: Tuesday, March 27, 2007 2:36 PM

 On this page, my hovers for the horizontal bar of main navs 
 doesn't work in 
 Firefox, except for the first 3. I used the same code for 
 another site that 
 used horizontal navs and worked fine in all browsers. For the 
 life of me, I 
 can't seem to figure this out.

 http://www.igryphon.com/microtia_final/age-to-begin.html

 If you have any input I'd sure appreciate it.

To fix this specific problem, remove the z-index from #pagetitle_ma.

You should validate the HTML [1] and CSS [2] (CSS was fine in this case)
(cener is not valid HTML, center is depreciated). I say this as it would
have saved me several hours recently.

I used Firebug's [3] inspect option to look at your Long term result
option. As I was going to that one, I noticed the border appear for your
AGE TO BEGIN... section and realized it was placed on top of the menu bar.

[1]
http://validator.w3.org/check?verbose=1uri=http%3A%2F%2Fwww.igryphon.com%2F
microtia_final%2Fage-to-begin.html
[2]
http://jigsaw.w3.org/css-validator/validator?profile=css2warning=2uri=http
%3A%2F%2Fwww.igryphon.com%2Fmicrotia_final%2Fage-to-begin.html
[3] http://www.getfirebug.com/

--G

__
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] Breakout input tags

[Paul Seale]

I have a question regarding input tags. Currently when I cant to change the
style of an input element (select menus, text input, etc) I use the .css
input call.

My question is this: Is there a way to break it out to format just the
password and text fields?

Thank you in advance.


__
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] IE Transparent PNG Background (that repeats)

[Paul Novitski]

At 3/27/2007 12:41 PM, BJ Clark wrote:
Anyone out there know of a fix for IE that allows repeating (repeat-x
or repeat-y) transparent PNG background images?


I have never heard of a way to force IE7 to repeat a PNG background 
image with alpha transparency supported.

One work-around is to modify the DOM with javascript, inserting as 
many new elements as necessary to fill the necessary dimension, each 
with the same image as its background.  Any javascript solution will 
of course exclude visitors with scripting disabled.

Another approach that can work in certain circumstances is to create 
one very tall PNG for use in IE7 -- non-repeating but long enough to 
support vertical expansion for anticipated text-size enlargements.

Regards,

Paul
__

Paul Novitski
Juniper Webcraft Ltd.
http://juniperwebcraft.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/

Re: [css-d] font-size advice

[Gunlaug Sørtun]

[EMAIL PROTECTED] wrote:
 There are no definitive answers to anything on the web, there will 
 always be an exception to any rule we care to make, that's what we 
 have to live with, and work with. So lets all accept it and move 
 on..
 
 Agree or not 'Georg?'

Asked directly like that, I have to say I agree - more or less.

Rules without exceptions are limitations, in my terminology. I hate
limitations, so I always reserve the right to make exceptions :-)

 I've learned a lot over the last ten days, now have to start all over
  again..

Slightly wrong approach, IMO. No need to discard what works, only what
doesn't.

A better approach might be to fix or remove the parts that aren't
working, keep the rest and add whatever is needed to make it all work
together as a whole.
I'll also advice that one continuously expands ones library of rules and
exceptions - especially exceptions, since even the smallest details may
come handy one day.

regards
Georg
-- 
http://www.gunlaug.no
__
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] Breakout input tags

[Glenn E. Lanier, II]

 From: Paul Seale
 Sent: Tuesday, March 27, 2007 3:44 PM

 My question is this: Is there a way to break it out to format just the
 password and text fields?

Paul,

Yes, and no. input[type=text] will work, but not in IE, so you're better off
assigning a class to the input elements in question.

--G

__
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] Breakout input tags

[Jukka K. Korpela]

On Tue, 27 Mar 2007, Paul Seale wrote:

 I have a question regarding input tags. Currently when I cant to change the
 style of an input element (select menus, text input, etc) I use the .css
 input call.

So you have a rule with the element name input as the selector:

input { /* some CSS declarations */ }

 My question is this: Is there a way to break it out to format just the
 password and text fields?

Ideally you could use

input[type=text], input[type=password] { /* some CSS declarations */ }

but there's the problem that IE 6 and older won't understand it, because 
they do not recognize such attribute selectors. Moreover, [type=text] 
matches only such elements that have type=text _explicitly_ set, not 
defaulted as we often default in input elements.

So in practice it's safer to use class selectors, e.g. assign a class to 
each password and text field and use a class selector. Depending on the 
context, there might be other, more convenient ways, like contextual 
selectors, e.g.

#foo input { ... }

which applies to all input elements that are inside the element that has 
id=foo, and only to them.

-- 
Jukka Yucca Korpela, http://www.cs.tut.fi/~jkorpela/

__
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] And now it's Firefox 2 (was Float Drops)

[Richard Grevers]

Hi folks:
Same page, http://www.freeparking.co.nz/hosting/
The Firefox 2 users in our office report that the background images
for the rounded boxes in the right hand column (Renew hosting and
Select currency) are escaping their containers and spreading under the
left column.

I'm guessing this must be a bug in Firefox - is there a workaround?
Rendering engines - ya gotta love'em!
-- 
Richard Grevers, New Plymouth, New Zealand
Hat 1: Development Engineer, Webfarm Ltd.
Hat 2: Dramatic Design www.dramatic.co.nz
__
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] And now it's Firefox 2 (was Float Drops)

[Ian Young]

 Hi folks:
 Same page, http://www.freeparking.co.nz/hosting/
 The Firefox 2 users in our office report that the background images
 for the rounded boxes in the right hand column (Renew hosting and
 Select currency) are escaping their containers and spreading under the
 left column.

 I'm guessing this must be a bug in Firefox -

Rught hand col is ok on my FF2 WinXP.
However, the site looks completely different from IE6 as it is full page in
FF and in a wrapper in IE6.

Now I can categorically say that this is not due to a bug in FF and is more
likely to do with the site having been built in IE6 rather than FF.
Sorry haven't the time to look at style to see the problem.

Cheers

Ian
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.5.446 / Virus Database: 268.18.18/734 - Release Date: 26/03/2007
14:31

__
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] And now it's Firefox 2 (was Float Drops)

[Richard Grevers]

On 3/28/07, Raine [EMAIL PROTECTED] wrote:
 I don't see that in Firefox/2.0.0.3...the page looks fine to me.

ok folks, here's a screenshot: http://www.freeparking.co.nz/test/ff2.jpg
-- 
Richard Grevers, New Plymouth, New Zealand
Hat 1: Development Engineer, Webfarm Ltd.
Hat 2: Dramatic Design www.dramatic.co.nz
__
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] And now it's Firefox 2 (was Float Drops)

[Richard Grevers]

On 3/28/07, Ian Young [EMAIL PROTECTED] wrote:


 Rught hand col is ok on my FF2 WinXP.
 However, the site looks completely different from IE6 as it is full page in
 FF and in a wrapper in IE6.

 Now I can categorically say that this is not due to a bug in FF and is more
 likely to do with the site having been built in IE6 rather than FF.
 Sorry haven't the time to look at style to see the problem.

The site uses the same wrapper for all browsers. its just that in IE6-
it is fixed at 800px and in good browsers we use min-width and
max-width to let it vary between 760 and 960px
:-) I develop  to standards in Opera, firefox is nearly always fine,
and then we fix for IE7 and IE6.

-- 
Richard Grevers, New Plymouth, New Zealand
Hat 1: Development Engineer, Webfarm Ltd.
Hat 2: Dramatic Design www.dramatic.co.nz
__
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] CSS menu oddness in IE7

[Jade True]

Sorry to reply to my own post. Any Ideas on this one?


 Can someone help me figure out what is going on with the css menus on
 this site in IE7? I can't seem to figure it out.

 http://www.zencart137.jadetrue.com  (grey menu up top)

 If you spend some time traveling through the menu, then hover off the
 menu mid-travel, then come back to it, some parts of the menu has
 hiding text, till you hover around some more. Ok, so that's a
 terrible explanation, but please test out and see if you can see the
 same behavior. This only seems to occur in IE (I've seen it in IE7,
 it may happen in earlier versions as well).

 Thanks for any suggestions!
 Jade True
 [EMAIL PROTECTED]

__
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] And now it's Firefox 2 (was Float Drops)

[~davidLaakso]

Richard Grevers wrote:
 Same page, http://www.freeparking.co.nz/hosting/
 The Firefox 2 users in our office report that the background images
 for the rounded boxes in the right hand column (Renew hosting and
 Select currency) are escaping their containers and spreading under the
 left column.

 I'm guessing this must be a bug in Firefox - is there a workaround?
 Rendering engines - ya gotta love'em!
   



Strange.

I am not able to reproduce this problem in XP in any window size with
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.3) 
Gecko/20070309 Firefox/2.0.0.3

nor in

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.4) 
Gecko/20060516 SeaMonkey/1.0.2

and I do not see it in these win/2k, xp captures of  Firefox 2.0 and 1.5.0.
http://www.browsercam.com/public.aspx?proj_id=335212

The page does not hold font-scaling well as previously mentioned. But 
even that does not yield anything on this end that looks like the screen 
shot you sent.

Regards,
~dL

-- 
http://chelseacreekstudio.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/

Re: [css-d] And now it's Firefox 2 (was Float Drops)

[david]

~davidLaakso wrote:
 Richard Grevers wrote:
 Same page, http://www.freeparking.co.nz/hosting/
 The Firefox 2 users in our office report that the background images
 for the rounded boxes in the right hand column (Renew hosting and
 Select currency) are escaping their containers and spreading under the
 left column.

 I'm guessing this must be a bug in Firefox - is there a workaround?
 Rendering engines - ya gotta love'em!
 
 Strange.
 
 I am not able to reproduce this problem in XP in any window size with
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.3) 
 Gecko/20070309 Firefox/2.0.0.3
 
 nor in
 
 Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.4) 
 Gecko/20060516 SeaMonkey/1.0.2
 
 and I do not see it in these win/2k, xp captures of  Firefox 2.0 and 1.5.0.
 http://www.browsercam.com/public.aspx?proj_id=335212

I don't see it in FF2.0.0.3 for Linux, either.

-- 
David
[EMAIL PROTECTED]
authenticity, honesty, community
__
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] Rollovers (hovers) not working in Firefox

[~davidLaakso]

Kathi Cushman wrote:
 Hi all,

 First of all, I'm fairly new to CSS and taking over for my partner, so 
 there's probably a better way of doing things than the method I'm using.

 On this page, my hovers for the horizontal bar of main navs doesn't work in 
 Firefox, except for the first 3. I used the same code for another site that 
 used horizontal navs and worked fine in all browsers. For the life of me, I 
 can't seem to figure this out.

 http://www.igryphon.com/microtia_final/age-to-begin.html
   


Not sure.

When I isolate the menu on a local file there is no problem. The menu 
works just fine.
When the rest of the content is added to the file the menu exhibits the 
behavior you wrote about.
It /may/ be that this (which contains h1 is overlapping and blocking the 
hover)
#pagetitle_ma { background: fuchsia;
position: absolute;
top: 130px;  revise this to 130px from 150px
right: 0px;
width: 540px;
z-index: 2;
}

The above /seems/ to correct the problem on a local file in FF.




 On a side note, the horizontal nav bar is made up of one horizontal div, 
 then individual divs nested in it for each nav button. I would rather 
 have had the buttons all in the one larger div, but I couldn't get them to 
 display in a row, even when I changed display: block to display: inline.

 If you have any input I'd sure appreciate it.


   


You might look at this 
http://css.maxdesign.com.au/listamatic/horizontal03.htm menu for 
thought on how to do that. As a strictly personal opinion, I think I'd 
do the rollovers with text, rather than images as he has in the example. 
As it stands now, you've got a tremendous amount of code and a bunch of 
images need to create a simple means of navigation.

Best,
~dL

PS Do you think the content text is maybe a little tiny for some folks?




-- 
http://chelseacreekstudio.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/

Re: [css-d] Background image not appearing [SOLVED]

[Dave M G]

Gunlaug,

Thank you for responding.

 One stray '}' creates a parse-error, so the next rule - which happens to
 be .linklist isn't read by browsers.
 - 1 parse error - not ok - and is the cause of your problem. 

Silly me. I thought that stray } was a part of the Be Nice To Opera 5 
Hack which precedes it. But now I see that the hack already has a 
closing bracket, and somehow an additional one was in there.

Thanks for pointing out my error. This has indeed solved the problem.

-- 
Dave M G
Ubuntu 6.10 Edgy Eft
Kernel 2.6.20-5-generic
Pentium D Dual Core Processor
PHP 5, MySQL 5, Apache 2


__
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] Rollovers (hovers) not working in Firefox

[~davidLaakso]

~davidLaakso wrote:
 Kathi Cushman wrote:
   


 On this page, my hovers for the horizontal bar of main navs doesn't work in 
 Firefox...]

 http://www.igryphon.com/microtia_final/age-to-begin.html  
 


   
Whooops! I see now that at least 47 other list members have already 
answered your question :-[ .
~dL
__
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] z-index issues

[David Gallanders]

In reply to [EMAIL PROTECTED] [EMAIL PROTECTED]
discuss.org who, at 06:52 on 27/3/07, wrote:

Message: 14
Date: Mon, 26 Mar 2007 03:33:19 -0400
From: Harlan [EMAIL PROTECTED]
Subject: [css-d] z-index issues
To: css-d@lists.css-discuss.org
Message-ID:
   [EMAIL PROTECTED]
Content-Type: text/plain; charset=ISO-8859-1; format=flowed

Hi, I'm developing CSS tabs  subtabs, and having trouble with the subtabs.
I want to hide the rows of subtabs that are not currently active.  This
appears to work in Firefox (2.0.0.1) but fail in IE (7.0.x, and also in 6.x).


The page in question is here:
http://www.redmoonherbs.com/zz_test_harlan/classes.php

In IE you should see orange subtabs, with some unfortunate red subtabs
behind them, even though the red subtabs have a z-index of -1.

I think I have my stacking contexts wrong, but I can't figure out how to
make them right, as both the main tab ul and the subtab ul seem to
require a position: absolute AFAIKT (meaning that I am adapting these from
examples online, and I'm no CSS expert, any suggestions welcome!)

Harlan,

As a fellow learner, I would suggest you start by validating your HTML
and CSS first. By checking and removing syntax errors, I have answered
many problems that have baffled me at times.

CSS validator: http://jigsaw.w3.org/css-validator/

HTML validator: http://validator.w3.org/

David Gallanders
-- 
Paphos, Cyprus
N3451 E03225
GMT+2 (+3 summer)

__
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] pros and cons of separate css files for IE and non-IE?

[Matt Nathan]

We've been trying to design a CSS-based site that looks good in both 
IE and Firefox, without having to maintain separate CSS files.
It is difficult, so I'm wondering if we should go to separate CSS 
files with some hack to call the appropriate CSS file for the user's 
browser. What are the pros and cons of that approach? And if we do go 
that route, what are the pros and cons of different browser-matching 
hacks? Thanks!

__
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] Site check please

[Jeralyn Merideth]

I have tested on IE 5.5, 6, and 7...the current versions of Firefox and Opera. 
Could someone please test on older browsers and the Mac please?

http://www.servcon.net/new/index.htm

TIA,

Jeralyn


 

8:00? 8:25? 8:40? Find a flick in no time 
with the Yahoo! Search movie showtime shortcut.
http://tools.search.yahoo.com/shortcuts/#news
__
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] form content wrapping help/test in IE Win

[Timothy Martens]

Hi All,

Trying to get the

Name ____
First Last / Surname

In my form not to wrap in IE/Win

Screenshots here: http://browsershots.org/website/http:// 
66.216.113.114/bookings/

Live here: http://66.216.113.114/bookings/
CSS: http://66.216.113.114/stylesheets/grendel133i.css

A WAY compacted version of the code: http://splashdesign.com/temp/ 
index.html

Possible fix, (can you check for me) here: http://splashdesign.com/ 
temp/index2.html


__
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] css-d Digest, Vol 52, Issue 45

[Tim Kadlec]

Marc Van Den Dobbelsteen had a good article on how to do this over at A List 
Apart. Here's the link:

http://alistapart.com/articles/switchymclayout

Tim Kadlec



Message: 24
Date: Mon, 26 Mar 2007 12:33:18 -0700 (PDT)
From: n h [EMAIL PROTECTED]
Subject: [css-d] screen area detection/alt style sheets
To: css-d@lists.css-discuss.org
Message-ID: [EMAIL PROTECTED]
Content-Type: text/plain; charset=iso-8859-1

Hi, I'm new to the list and am looking for some
(hopefully simple) javascript that detects the browser
window width and then delivers one style sheet for
window widths 900 px and smaller, and another style
sheet for screens wider than 900 px (or whatever
measurements are entered into the script).

I searched through the archives and found a thread on
this that had a link from HTH-Mike to a script that
sounds like it is what I'm looking for, but the link
doesn't work anymore:

I have a script that checks the window width, then
serves up appropriate css for the monitor width. I
design for 800x600, but have a backup css
for 640x480.

_
Interest Rates near 39yr lows! $430,000 Mortgage for $1,399/mo - Calculate 
new payment 
http://www.lowermybills.com/lre/index.jsp?sourceid=lmb-9632-18466moid=7581

__
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] pros and cons of separate css files for IE and non-IE?

[david]

Matt Nathan wrote:
 We've been trying to design a CSS-based site that looks good in both 
 IE and Firefox, without having to maintain separate CSS files.
 It is difficult, so I'm wondering if we should go to separate CSS 
 files with some hack to call the appropriate CSS file for the user's 
 browser. What are the pros and cons of that approach? And if we do go 
 that route, what are the pros and cons of different browser-matching 
 hacks? Thanks!

Use a common style sheet, with one (or more) second IE-only stylesheets 
linked into the HTML via conditional comments. No hacks needed.

-- 
David
[EMAIL PROTECTED]
authenticity, honesty, community
__
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] Site check please

[~davidLaakso]

Jeralyn Merideth wrote:
 I have tested on IE 5.5, 6, and 7...the current versions of Firefox and 
 Opera. Could someone please test on older browsers and the Mac please?

 http://www.servcon.net/new/index.htm

 TIA,

 Jeralyn


   
27 screen captures http://www.browsercam.com/public.aspx?proj_id=335244
Safari, mac/ie5.2, ff1.5, and more...

Aside:
-- your nav may be breaking early (+1 in ff and text-size largest in ie).
-- adding:  html { font-size: 100%; } will keep ie from going goofy when 
the fonts are scaled (ie em font-scaling bug).

Best,
~dL


-- 
http://chelseacreekstudio.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/

Re: [css-d] form content wrapping help/test in IE Win

[Timothy Martens]

Hi All,

Are the first name last name field inline now? (No longer wrapping).

http://splashdesign.com/temp/index3.html

T
__
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] form content wrapping help/test in IE Win

[~davidLaakso]

Timothy Martens wrote:
 Hi All,

 Are the first name last name field inline now? (No longer wrapping).

 http://splashdesign.com/temp/index3.html

 T

   
!2 captures (ie, ff, opera)
http://www.browsercam.com/public.aspx?proj_id=335257
I did not wait for them to load.

~dL

-- 
http://chelseacreekstudio.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/

Re: [css-d] pros and cons of separate css files for IE and non-IE?

[George Ornbo]

On 3/28/07, david [EMAIL PROTECTED] wrote:

 Use a common style sheet, with one (or more) second IE-only stylesheets
 linked into the HTML via conditional comments. No hacks needed.

I'd second that. Try and avoid hacks entirely if you can. The box
model hack is easy enough to avoid if you code defensively. If you
really need to hack use conditional stylesheets. Hacking in the same
stylesheet can cause problems in newer browsers, especially IE7.

For more info see
http://blogs.msdn.com/ie/archive/2005/10/12/480242.aspx

Cheers
George

Shape Shed | http://www.shapeshed.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/