date:20061022

At 05:40 PM 10/22/2006, Robert L. Hicks wrote:
>I also use a Mac. I ran across this site this morning:
>http://www.browsercam.com/default.aspx. It isn't free, but it would
>cost a fortune to have access to everything they offer. They do have a
>free trial. I'm going to give it a whirl to see how it works.

What I've known others to do is get a group together and go in on one 
account.  I don't know the particulars how it's done, was a member 
once but I didn't set it up.  You all split the cost then for a 
year's subscription.  Get 20-25 people together and it winds up 
costing only like $20-$25 for a year.

:: Deb | PBC Web Design
:: http://www.PBCWebDesign.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] cascading problem with tables

2006-10-22 Thread Philippe Wittenbergh


On Oct 23, 2006, at 11:44 AM, David Bailey wrote:

> 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.

Oops, I was wrong somewhere...

The li is affected by .displayPage li {font-size: 85%;}

The same explanation applies, basically. Make the font-size of the  
 85% of the size of it's parent (which is the td, which is .85em  
(=85%))

Philippe
---
Philippe Wittenbergh





__
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] Web Testing

2006-10-22 Thread Thierry Koblentz

Julie Hathaway wrote:
> On Oct 22, 2006, at 7:48 PM, Thierry Koblentz wrote:
>> IMHO, you should still make sure that your sites are "accessible" in
>> ie Mac.
>> Regarding emulators à la Browsercam, there are many issues
>> screenshots do
>> not reveal.
>> It is better to use a service like "BC-Remote" because it lets you
>> see how
>> your layout behaves when you change the width of the viewport, when
>> you hover over links, etc. etc.

> Actually, browsercam offers both screenshots and remote access.

That what's called "BC-Remote" ;-)

---
Regards,
Thierry | www.TJKDesign.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] disappearing text

Daniel wrote:
> http://dragonofchaos.net/play/
> 
> When I try the above page in IE the blockquote disappears. Works fine
> in Firefox & Netscape.

IE-win's stacking problems...

Add...

blockquote {position: relative;}

...to make it stay on top and be visible.

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] IE border quirk

Linda Quinn wrote:

> www.lifeonwheels.com/beta2.

> Question - why would removing the border declaration cause the entire
>  left column to move? It was my understanding that a border is not 
> part of the actual container, only an outline.

Borders affect interaction between elements under certain circumstances,
not only as a visual outline.

There are more than one factor at play here, so I'll try to spell them out.

What the border does across browser-land:

Didn't look deep, but it looks like the border is preventing some
margins on elements from "escaping" #columnwrapper. Visible change in
Opera and Firefox too when the border is removed - without the
disastrous result that IE6 shows.

A simple test shows that a 'padding-top: 1px;' can replace the
'border:0.1em solid white;' and achieve the same effect, and this is a
clear sign that 'collapsing margins'[1] are at play.
You have accidentally found one of the many workarounds for this
standardized but often unwanted effect.

---

IE6 has a bug:

What's bugging IE6 in particular is a bit more complex. It's a real
IE-bug affecting _absolute positioned elements next to floats_, and that
bug is somehow contained along with any collapsing margins in your case.

IE6 is otherwise not affected by 'collapsing margins' in your page,
probably because there are too many elements with default or triggered
'hasLayout'[2] in there. Another reason can be differences in
margin-defaults in IE6 vs. other browsers. No margins = no collapse.

The IE-bug can in itself be cured by placing a non-floating and
non-positioned element between the end-tag of 'leftcolumn' and the
start-tag of 'rightcolumnholder'.
A zero-size element - like a div with nothing but a comment inside - as
separator, will kill the IE-bug...

...without affecting other browsers.

I would still keep the 'border' or 'padding' on #columnwrapper though,
as containing those margins will make the line-up more cross-browser
reliable.

---

Now, making that source-code a little more valid and in accordance with
the chosen doctype, wouldn't hurt. The CSS validator can't find the
stylesheet through the page - amongst other things. Fixing the
source-code won't change rendering in any browser - that I know of, but
it sure will help during debugging and maintenance.

regards
Georg

[1]http://www.w3.org/TR/CSS21/box.html#collapsing-margins
[2]http://www.satzansatz.de/cssd/onhavinglayout.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] 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  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
> 
>
>
>
>
> __
> 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/

Re: [css-d] cascading problem with tables

2006-10-22 Thread Philippe Wittenbergh

On Oct 23, 2006, at 10:31 AM, David Bailey wrote:

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

__
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] disappearing text

2006-10-22 Thread Daniel

http://dragonofchaos.net/play/

When I try the above page in IE the blockquote disappears. Works fine in 
Firefox & Netscape.
The gray above the picture I'm pretty sure is a png problem.
__
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] some sort of problem.

Jon Hughes wrote:

>http://www.phazm.net/stamps/products.html
>
>If you view this page in FF it's fine, 
>
Hi Jon,
It's fine ... until the visitor is enlarging the font-size with one or 
more steps (then the placeholders are shifting away) ...
Screenshot-1 

... or is scaling down (then the placeholders are gluing together) ...
Screenshot-2 

... or has a screen of 1280x1024 or bigger (then the used area is only 
30% or less of the available screen area)...
Screenshot-3 

>but IE kinda... doesn't like it.
>I have no idea what's wrong with it though (still learning the IE hacks)
>- can someone help me?  (I use digest, so please reply to my email
>directly if you can) [EMAIL PROTECTED]
>
>Also, if you can tell me how to bring the "Next Page" up a bit, I would
>appreciate it :)
>
>(if you see any other problems not related to what my post is about,
>please let me know, I'm trying to learn to code GOOD compliant
>xhtml/css.  So I need to know if I'm making a mistake.)
>
>Thanks!
>
>- Jon
>  
>
... but is is not yet a week after the Graphical Designer came to the 
CSS Guru, and he has some more weeks to go. ;-) [1]
I'm not a Guru, but while time is going on, maybe I can provide you with 
some hints in the meantime.

In general I use my "7 Golden Rules of Webdesign":

   1. Work in the TOP-DOWN approach of a page, and write the css in the
  same order.
   2. Do it STEP-BY-STEP (and first the model, the beautiful
  content-styles you have in mind - the real stuff things - have to
  wait ...). If working on an existing page, comment out all
  elements you don't work on yet (maybe they have styles which are
  disturbing the rest, or have styles which have to be a part of the
  rest, but aren't there). Take no risk!
   3. With TESTING-AND-TESTING-AND-TESTING at each small step, you'll
  never find surprises at the end!
  Testing: the html-validator every now and then, the css-validator
  (mostly the warnings can wait), the font-scaling, the resolution.
  So testing at (almost) EACH STEP: "Is it still working what I made
  before?".
   4. Paste all STYLES IN THE HEAD as long as the work is not finished,
  is easy adapting, and a condition for:
   5. the personal archive: SAVE EVERY STEP with an OWN VERSION NUMBER!
  (If you don't, and notice an error after say 5 steps, you have to
  remember all changes you made in between. My experience is: I
  always forget some... "I had such a beautiful solution, but it
  doesn't work anymore. - Where did I change things, and what was
  the last step before it went wrong?").
   6. For each step: DEVELOP IN FIREFOX (or OPERA), as that is nearly
  standards compliant. And if it's working as you want it, then
  CORRECT FOR IE afterwards. - The other way, first working for IE
  and "correcting" for other browsers is almost impossible, due to
  the 1000's of IE-only proprietary rules and all known and
  mysterious IE-errors and IE-bugs...
   7. To see where you are: use TEMP BACKGROUND COLORS for the
  div-boxes, ul's, li's and other elements. Sometimes a TEMP
  {border: 1px dashed red;} can do the same, but that is a bit more
  risky, because adding/removing borders can influence the layout.

And don't forget to play with margins and paddings: see what happens!

Now in practice. I think the elements in your page need some more space 
to breathe. How can we make your page more liquid?
I started with your original, threw the html-validator on it, and got 
the following:
Testpage-1 

Html-validator and css-validator congratulate. - To get rid of the 
(only) 500px width of the model, we can adapt the #wrap. Then the width 
becomes relative to the screen width, and the page uses the same 
relative width in each resolution. See (and see the comments in the 
source code):
Testpage-2 

Html-validator and css-validator still congratulate. - Changing 
resolution to 800x600 and to 1280x1024: no problems with this model. But 
now the header (image), the sidebar, the content and the footer have 
wrong places. And in IE the placeholders are still not besides each other.

In the top-down approach we forget the rest, and start with the header. 
The right top-corner is somewhere in the center, doesn't belong there! 
Taking the right corner away of the image, we can put it apart as a 
background image, liquid moving on the right side. We get something like:
Testpage-3

[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] Web Testing

2006-10-22 Thread Julie Hathaway

On Oct 22, 2006, at 7:48 PM, Thierry Koblentz wrote:

>> Is there a way to test how a site looks in all the major browsers
>> online?  I have a Mac and I run FF 1.5.  It is useless for me to test
>> on IE 5 for Mac as it is now obsolete.  I don't want to have to fire
>> up my old Dell laptop to test a site.  So is there a way to check how
>> a site looks online?  Like a browser emulator?
>
> IMHO, you should still make sure that your sites are "accessible" in 
> ie Mac.
> Regarding emulators à la Browsercam, there are many issues screenshots 
> do
> not reveal.
> It is better to use a service like "BC-Remote" because it lets you see 
> how
> your layout behaves when you change the width of the viewport, when you
> hover over links, etc. etc.

Actually, browsercam offers both screenshots and remote access. I use 
screenshots for the first pass, and if everything looks okay I 
double-check with the remote access. True, browsercam ain't cheap, but 
you can have up to 20 people on one account. Find 19 others to go in on 
a membership with you and it comes down to something like twenty bucks 
a year. I found 19 other people through www.fundable.org.

Regards,

Julie Hathaway
www.pilcrow.biz
__
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] Test_please_1

Administration wrote:
> http://www.highburytearooms.com.au/
> http://www.highburytearooms.com.au/highbury.css
>
> Site page renders fine in both FF 1.5 and IE 6
>
> Experiencing problems with Opera 9.0.1 where the page font is smaller 
> than in the other browsers.
>
> Keno.
>
>   
Keno,

I did not see the image border problem that you mentioned in xp ::  ie7, 
ff, or opera.
And I do not know what you mean about the background color for the text 
you wrote about.
You do need a background-color for the page, see: 
.
To bump the font size for Opera only, use the appropriate selector(s) 
with this filter at the very bottom of the style sheet:
@media screen and (min-width: 0px){
#foo { font-size: whatever%!important; }
} /*be even nicer to opera */

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/

[css-d] Test_please_1

2006-10-22 Thread Administration

Hi list,

I would appreciate  a cross browser check please!!

http://www.highburytearooms.com.au/
http://www.highburytearooms.com.au/highbury.css

Site page renders fine in both FF 1.5 and IE 6

Experiencing problems with Opera 9.0.1 where the page font is smaller 
than in the other browsers.

View>Style> Author mode
View>zoom>100%
--

I have unwanted background color in the following text block:


**Hours:**


*Dinner *Fri-Sat**


*Morning Tea & Lunch *Thurs-Sun**


**Wed-* Appointment only (Group Bookings)*

---

Also there is a 1px border part way around the maim image

I have: img  {
border: none;
   }
---

Thanks in advance,

Keno.

__
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] Web Testing

2006-10-22 Thread Brian Zollinhofer

Is there a way to test how a site looks in all the major browsers online?  I
have a Mac and I run FF 1.5.  It is useless for me to test on IE 5 for Mac
as it is now obsolete.  I don't want to have to fire up my old Dell laptop
to test a site.  So is there a way to check how a site looks online?  Like a
browser emulator?

If not, I use the Web Dev and Firebug FF extensions a lot when figuring out
problems (extremely helpful when finding out what is wrong with other
people's sites).  Is there anything similar for IE6 for Windows?

-Brian

-- 
•--•--•--•--•--•--•--•--•--•--•--•
Brian Zollinhofer
email: [EMAIL PROTECTED]
website: http://www.zollinhofer.com

"It is better to keep your mouth closed and let people think you are a fool
than to open it and remove all doubt."
- Mark Twain
__
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] Web Testing

2006-10-22 Thread marcello09

http://browsershots.org/

At the moment it's a free service, so enjoy it while it lasts!

Of course, it only shows you how your site will *look* in a particular 
browser. There's no way to test the functionality.

As far as I know, there's no WebDev equivalent for IE.

-- Marcello




- Original Message - 
From: "Brian Zollinhofer" <[EMAIL PROTECTED]>
To: 
Sent: Sunday, October 22, 2006 6:22 PM
Subject: [css-d] Web Testing


Is there a way to test how a site looks in all the major browsers online?  I
have a Mac and I run FF 1.5.  It is useless for me to test on IE 5 for Mac
as it is now obsolete.  I don't want to have to fire up my old Dell laptop
to test a site.  So is there a way to check how a site looks online?  Like a
browser emulator?

If not, I use the Web Dev and Firebug FF extensions a lot when figuring out
problems (extremely helpful when finding out what is wrong with other
people's sites).  Is there anything similar for IE6 for Windows?

-Brian

-- 
•--•--•--•--•--•--•--•--•--•--•--•
Brian Zollinhofer
email: [EMAIL PROTECTED]
website: http://www.zollinhofer.com

"It is better to keep your mouth closed and let people think you are a fool
than to open it and remove all doubt."
- Mark Twain
__
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/

Re: [css-d] Web Testing

2006-10-22 Thread Robert L. Hicks

I also use a Mac. I ran across this site this morning: 
http://www.browsercam.com/default.aspx. It isn't free, but it would 
cost a fortune to have access to everything they offer. They do have a 
free trial. I'm going to give it a whirl to see how it works.

-Bob
On Oct 22, 2006, at 6:22 PM, Brian Zollinhofer wrote:

> Is there a way to test how a site looks in all the major browsers 
> online?  I
> have a Mac and I run FF 1.5.  It is useless for me to test on IE 5 for 
> Mac
> as it is now obsolete.  I don't want to have to fire up my old Dell 
> laptop
> to test a site.  So is there a way to check how a site looks online?  
> Like a
> browser emulator?
>
> If not, I use the Web Dev and Firebug FF extensions a lot when 
> figuring out
> problems (extremely helpful when finding out what is wrong with other
> people's sites).  Is there anything similar for IE6 for Windows?
>
> -Brian
>
> -- 
> •--•--•--•--•--•--•--•--•--•--•--•
> Brian Zollinhofer
> email: [EMAIL PROTECTED]
> website: http://www.zollinhofer.com
>
> "It is better to keep your mouth closed and let people think you are a 
> fool
> than to open it and remove all doubt."
> - Mark Twain
> __
> 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] Proper float behavior question

2006-10-22 Thread Jared Stein

Hey folks, I'm trying to figure out what the proper behavior is for the
following simple example:

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>


Yo

#elone { width: 20%; float: left; background: green; }
#eltwo { width: 20%; float: left; clear: left; background: red;
}
#elthree { width: 80%; float: left; background: orange; }
#elfour { width: 80%; float: left; background: blue;  }




1
2
3
4



IE 6 Win allows #elthree to set the position it's top outer edge to the
top outer edge of #elone.  Firefox Win only allows #elthree to set the
position of its top outer edge to the top outer edge of #eltwo--the
clear: left in #eltwo constraining the flow of the following floaters. 

Relevant W3C specs ( http://www.w3.org/TR/CSS21/visuren.html#float-rules
or http://www.w3.org/TR/CSS21/visuren.html#propdef-clear ) don't make
the proper behavior clear to me. If anything, they suggest that IE Win
6's rendering is correct ("A floating box must be placed as high as
possible.") 

Jared Stein

   Director of Instructional Design Services
   Utah Valley State College, MS 149
   http://www.uvsc.edu/disted/
__
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] Web Testing

2006-10-22 Thread Thierry Koblentz

> Is there a way to test how a site looks in all the major browsers
> online?  I have a Mac and I run FF 1.5.  It is useless for me to test
> on IE 5 for Mac as it is now obsolete.  I don't want to have to fire
> up my old Dell laptop to test a site.  So is there a way to check how
> a site looks online?  Like a browser emulator?

IMHO, you should still make sure that your sites are "accessible" in ie Mac.
Regarding emulators à la Browsercam, there are many issues screenshots do
not reveal.
It is better to use a service like "BC-Remote" because it lets you see how
your layout behaves when you change the width of the viewport, when you
hover over links, etc. etc.

> If not, I use the Web Dev and Firebug FF extensions a lot when
> figuring out problems (extremely helpful when finding out what is
> wrong with other people's sites).  Is there anything similar for IE6
> for Windows?

http://www.visionaustralia.org.au/info.aspx?page=614

---
Regards,
Thierry | www.TJKDesign.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] Strange Navigation Menu Problems

2006-10-22 Thread Ian Young

> Subject: Re: [css-d] Strange Navigation Menu Problems
>
>
> FF seems OK but any ideas on IE?
>
>
>
Actually FF isn't ok. Menu works but content is waaay down the page.

You need to validate your html tho'.
see:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.oscar-radio.org
%2Fstatic

Also good idea to put JavaScript "showtime" and "sfhover" off page.


Have a quick look at http://www.iyesolutions.co.uk/examples/dropdown-menu/
which should give you the answer to you menu issues.

Ian
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.408 / Virus Database: 268.13.9/490 - Release Date: 20/10/2006

__
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] Strange Navigation Menu Problems

2006-10-22 Thread Henry Felton

FF seems OK but any ideas on IE?



On 22/10/06, Roger Roelofs <[EMAIL PROTECTED]> wrote:
>
> Henry,
>
> On Oct 22, 2006, at 1:58 PM, Henry Felton wrote:
>
> >  Could I get some help on a new site I'm doing? The navigation menu
> > is a
> > normal drop down system; but the drop down parts aren't inline with
> > their
> > parent. Its obvious if you look at the site (www.oscar-radio.org/
> > static)
> > only working in IE as yet.
>
> I am guessing that you found your solution.  I just tried it in ff1.5
> and it worked just fine.  I also noticed the the sub-menus were
> marked up as sub-lists, which is necessary for the Son of Suckerfish
> technique.  You might want to consider a min-height for the sub list
> elements to they are of equal height whether the link takes 1 line or
> two.
>
> hth
>
> --
> Roger Roelofs
> "Remember, if you're headed in the wrong direction,
>God allows U-turns!"
>  ~Allison Gappa Bottke
>
>


-- 
H D C Felton
Website:www.henryfelton.net
MSN: [EMAIL PROTECTED]
Gmail Chat: [EMAIL PROTECTED]
Phone: 07763799241
__
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] Strange Navigation Menu Problems

2006-10-22 Thread Henry Felton

Hi guys,

 Could I get some help on a new site I'm doing? The navigation menu is a
normal drop down system; but the drop down parts aren't inline with their
parent. Its obvious if you look at the site (www.oscar-radio.org/static)
only working in IE as yet. The movement away from where they should be is
not a general shift to the right and so can't be altered by 'position:
relative' alterations. Any comments on the general design would also be
welcome?

 The CSS involved is below; it seems a simple problem but no obvious
solution?

Many thanks,

Henry


/* NAVIGATION */


  .navbutton {background-image: url('/images/new/nav.png');
background-repeat: repeat-x;
  width: 130px; height: 38px;
  border-bottom: 1px solid #2B2B2B; border-right: 1px solid #2B2B2B;
  font-family: arial; color: #dcdcdc; font-weight: bolder;
  text-align: center; font-size: 19px; letter-spacing: 1px; padding-top:
5px}



  .curvededge {background-image: url('/images/new/navend2.png');
  width: 66px; height: 38px;
  padding-top: 5px}


/* MENUS */

  #nav, #nav ul {padding: 0; margin: 0; list-style: none;}

  #nav {width:995px;
 height: 38px;}

  #nav a {display: block; } #nav li {float: left;}

  #nav li ul {position: absolute;  left: -999em; margin: 10px;}

  #nav li:hover ul {left: auto;} #nav li ul li a:link, a:visited
{text-decoration: none; /*Links on Drop Down */
  color: #dcdcdc;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 3px;
  padding-top: 4px;
  padding-bottom: 4px;}

  #nav li:hover ul, #nav li.sfhover ul {left: auto;}

  #nav li ul li {background-color: #65;   /* Drop Down */
border-left: 1px solid #393939;
border-right: 1px solid #393939;
   border-bottom: 2px solid #393939;
width: 125px;
font-family: arial;}

  #nav li ul li a:hover {background-color: #8B8B8B;}

  .topdrop {border-top: 1px solid #393939;} /*Gives a line on the top of the
drop down menus */

  .topdrop a:hover {background-color: green;
text-decoration: none;}
__
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] Strange Navigation Menu Problems

2006-10-22 Thread Roger Roelofs

Henry,

On Oct 22, 2006, at 1:58 PM, Henry Felton wrote:

>  Could I get some help on a new site I'm doing? The navigation menu  
> is a
> normal drop down system; but the drop down parts aren't inline with  
> their
> parent. Its obvious if you look at the site (www.oscar-radio.org/ 
> static)
> only working in IE as yet.

I am guessing that you found your solution.  I just tried it in ff1.5  
and it worked just fine.  I also noticed the the sub-menus were  
marked up as sub-lists, which is necessary for the Son of Suckerfish  
technique.  You might want to consider a min-height for the sub list  
elements to they are of equal height whether the link takes 1 line or  
two.

hth

-- 
Roger Roelofs
"Remember, if you’re headed in the wrong direction,
God allows U-turns!"
  ~Allison Gappa Bottke

__
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] Proper float behavior question

2006-10-22 Thread Philippe Wittenbergh


On Oct 23, 2006, at 7:04 AM, Jared Stein wrote:

> Hey folks, I'm trying to figure out what the proper behavior is for  
> the
> following simple example:
>
> [code snipped
>
> IE 6 Win allows #elthree to set the position it's top outer edge to  
> the
> top outer edge of #elone.  Firefox Win only allows #elthree to set the
> position of its top outer edge to the top outer edge of #eltwo--the
> clear: left in #eltwo constraining the flow of the following floaters.
>
> Relevant W3C specs ( http://www.w3.org/TR/CSS21/visuren.html#float- 
> rules
> or http://www.w3.org/TR/CSS21/visuren.html#propdef-clear ) don't make
> the proper behavior clear to me. If anything, they suggest that IE Win
> 6's rendering is correct ("A floating box must be placed as high as
> possible.")

But IE is wrong, as often the case.
A floated box cannot be higher than a previous floated box,
See rules 5 and 6 in


Philippe
---
Philippe Wittenbergh





__
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] image not showing up in NS7

At 11:33 AM 10/22/2006, Ingo Chao wrote:
>you forgot to copy/paste the semicolon.

Ohmahgosh!  Yes, I did and when I went in and fixed it - the image is 
now showing up even in NS7 - problem solved!  Thank you Georg for the 
fix and Ingo for pointing out my mistake!


:: Deb | PBC Web Design
:: http://www.PBCWebDesign.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] image not showing up in NS7

PBC Web Design wrote:
> ...
> 
> http://www.cedarcreekimages.com/new/3col-layout.html
> 
> and here is the css for it:
> http://www.cedarcreekimages.com/new/css/cci3columns2test.css
> 
> I copy/pasted your code in so I was sure I used what you sent and 
> commented out mine.  The letter "I" image is not showing up in my 
> Firefox, my IE6, Opera 9 or my NS7 (which is 7.02).
>

you forgot to copy/paste the semicolon.

Ingo

-- 
http://www.satzansatz.de/css.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] image not showing up in NS7

At 11:02 AM 10/22/2006, you wrote:
>PBC Web Design wrote:
>
>background: url(images/letter-I.gif) no-repeat 35px 0px;
>
>...but since that piece of style worked just fine in IE and Firefox at
>my end for a copy of your page, it left me wondering what made it *not*
>work at your end.
>
>There must be a difference between my background-property version and
>yours. What's there now is what you started out with - not what you said
>you tried, so as part of a simple debugging-procedure I'd like to see
>*what* you tried.

Ok, thanks for explaining.  I have a sample page up.  The first url 
is not for this as I have sent it off to the client for review and I 
don't want to be playing w/it while she's looking at it.   So, here 
is a new link:

http://www.cedarcreekimages.com/new/3col-layout.html

and here is the css for it:
http://www.cedarcreekimages.com/new/css/cci3columns2test.css

I copy/pasted your code in so I was sure I used what you sent and 
commented out mine.  The letter "I" image is not showing up in my 
Firefox, my IE6, Opera 9 or my NS7 (which is 7.02).



:: Deb | PBC Web Design
:: http://www.PBCWebDesign.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] image not showing up in NS7

PBC Web Design wrote:

> I'm sorry, I don't know what you mean, George.  Would you explain a 
> little bit more, please?

Well, you wrote "the image doesn't show up in IE or Firefox" when you
tried this...

background: url(images/letter-I.gif) no-repeat 35px 0px;

...but since that piece of style worked just fine in IE and Firefox at
my end for a copy of your page, it left me wondering what made it *not*
work at your end.

There must be a difference between my background-property version and
yours. What's there now is what you started out with - not what you said
you tried, so as part of a simple debugging-procedure I'd like to see
*what* you tried.

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] Div positioning

2006-10-22 Thread Pete Home

I'm trying to produce tabular type layout for venues and gigs using divs
where I end up with something like this;



VENU 1




VENU 1 DETAILS  |


V1g1 DETAILS|v1g1 PICTURE 


v1g2 PICTURE|v1g2 DETAILS


V1g3 DETAILS|


VENU 2




VENUE 2 DETAILS |


v2g1 DETAILS|


v2g2 DETAILS|v2g2 PICTURE



Etc

You'll notice that some gigs have pictures and some don't, and the pictures
are staggered left and right. A gig with a picture always starts a new
'row'.

I thought I'd end up with something like;

Venu1 name
venue 1 details
gig 1 details

  
gig 2 details
gig 3 details

Venu2 name
venue 2 details
gig 1 details
gig 2 details
  


All gigs and pictures will be 50% of the width 

What I wondered if there is some way of forcing this pattern of divs and
ensuring they start a new 'row' when there is a pictures associated with the
gig details.

Regards
Pete

__
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] sukckerfish over text

2006-10-22 Thread Schalk Neethling

Ross Hulford wrote:
> Hi,
>
> IE does not like this for some reason. It is totallty ignoring it.
>
>
> #nav li:hover ul
> {
> top:30px;
> z-index:2000;
> }
>
>
> Is your javascript correct. I have never used the Son Of Suckerfish. 
> anyone else?
>
> Ross
Yes, IE does not understand li:hover that is why there is the JavaScript 
that adds the class to the LI and then triggers the drop down. You 
should use:

#nav li:hover ul, #nav li.sfhover ul
{
top:30px;
z-index:2000;
}

I separated the IE 'hacks' from the rest of the CSS and placed it in the 
ie.css file.

HTH!
__
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] absolute positioning bug

[EMAIL PROTECTED] wrote:
> page w/ absolute position works fine in most or all browsers, except 
> IE 6 is off by one pixel right, and one pixel bottom... anybody know 
> why?

> http://www.fatgraffix.com/testing/test-absolute-position/absolute-test.html

IE6 isn't any good at calculating with odd numbers.

Odd numbers here...
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] image not showing up in NS7

At 10:27 AM 10/22/2006, Gunlaug Sørtun wrote:
>PBC Web Design wrote:
>
> >> background: url(images/letter-I.gif) no-repeat 35px 0px;
>
> >> N7 does not follow the newer 2.1 here.
>
> > I tried it, then the image doesn't show up in IE or Firefox.
>
>I tried it too, and the image shows up just fine in the mentioned
>browsers. Can you show us the style-version you tried?

I'm sorry, I don't know what you mean, 
George.  Would you explain a little bit more, please?  Thank you.


:: Deb | PBC Web Design
:: http://www.PBCWebDesign.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] image not showing up in NS7

PBC Web Design wrote:

>> background: url(images/letter-I.gif) no-repeat 35px 0px;

>> N7 does not follow the newer 2.1 here.

> I tried it, then the image doesn't show up in IE or Firefox.

I tried it too, and the image shows up just fine in the mentioned
browsers. Can you show us the style-version you tried?

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] image not showing up in NS7

At 07:36 AM 10/22/2006, you wrote:
>PBC Web Design wrote:
> > ...
> > I have an issue in NS7 on this page:>
> > http://www.cedarcreekimages.com/new/
> >
> > If you view in IE6 or FF, Opera 9 you'll note there is a letter *I*
> > image at the beginning of the first paragraph.  The problem is in NS7
> > the image doesn't show up.  ...
> > http://www.cedarcreekimages.com/new/css/cci3columns.css
> >
> > #content .imagine p {
> >  padding: 10px 5px 20px 35px;
> >  background: url(images/letter-I.gif) no-repeat 35px top;
> >  font-size: 105%;
> >  text-indent: 35px;
> > }
> > Try setting
>
>background: url(images/letter-I.gif) no-repeat 35px 0px;
>N7 does not follow the newer 2.1 here.

I tried it, then the image doesn't show up in IE or Firefox.

:: Deb | PBC Web Design
:: http://www.PBCWebDesign.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] sukckerfish over text

Hi,

IE does not like this for some reason. It is totallty ignoring it.


#nav li:hover ul
{
 top:30px;
 z-index:2000;
}


Is your javascript correct. I have never used the Son Of Suckerfish. anyone 
else?

Ross





 - Original Message - 
From: "Schalk Neethling" <[EMAIL PROTECTED]>
To: "Ross Hulford" <[EMAIL PROTECTED]>
Cc: "Brian Zollinhofer" <[EMAIL PROTECTED]>
Sent: Sunday, October 22, 2006 3:26 PM
Subject: Re: [css-d] sukckerfish over text


> Ross Hulford wrote:
>> Works in ff but IE, (would you believe it?) Ignores this property.
>>
>> Any other options?
>>
>> http://www.aplus.co.yu/lab/z-pos/
>>
>>
>> Ross
>>
>>
>>
>> - Original Message - 
>> From: "Brian Zollinhofer" <[EMAIL PROTECTED]>
>> To: 
>> Sent: Sunday, October 22, 2006 2:48 PM
>> Subject: Re: [css-d] sukckerfish over text
>>
>>
>> Try adding a z-index to your #menu_holder.  That should bring it above 
>> the
>> rest of your material.  I used z-index: 10; and it seemed to do the 
>> trick.
>>
>>
> Hey there Ross, Brian
>
> I am also using suckerfish for my drop downs at www.jcislord.org. I do not 
> have the problem you are experiencing but, I cannot for the life of me get 
> the drop down to go under the top nav element, it keeps pushing it over to 
> the right hand side. Maybe having a look at what I did will help you with 
> your problem.
>
> Also, can you please have a look at my nav in IE and let me know if you 
> can see why my drop downs are being pushed to the right.
>
> 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/

Re: [css-d] sukckerfish over text

Works in ff but IE, (would you believe it?) Ignores this property.

Any other options?

http://www.aplus.co.yu/lab/z-pos/


Ross



- Original Message - 
From: "Brian Zollinhofer" <[EMAIL PROTECTED]>
To: 
Sent: Sunday, October 22, 2006 2:48 PM
Subject: Re: [css-d] sukckerfish over text


Try adding a z-index to your #menu_holder.  That should bring it above the
rest of your material.  I used z-index: 10; and it seemed to do the trick.

On 10/22/06, Ross Hulford <[EMAIL PROTECTED]> wrote:
>
> I'll try again..
>
> The html
>
> http://www.blue-fly.co.uk/trisco/test.php
>
> the css
>
> http://www.blue-fly.co.uk/trisco/css/
>
>
> The problem is suckerfish goes behind the text (performance and events).
> Any help would be appreciated.
>
> I have had this problem berfore due to the dropdowns being absolutely
> positioned.
>
>
> thanks,
>
>
> Ross
> __
> 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/
>



-- 
•--•--•--•--•--•--•--•--•--•--•--•
Brian Zollinhofer
email: [EMAIL PROTECTED]
website: http://www.zollinhofer.com

"It is better to keep your mouth closed and let people think you are a fool
than to open it and remove all doubt."
- Mark Twain
__
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/

Re: [css-d] sukckerfish over text

2006-10-22 Thread Brian Zollinhofer

Try adding a z-index to your #menu_holder.  That should bring it above the
rest of your material.  I used z-index: 10; and it seemed to do the trick.

On 10/22/06, Ross Hulford <[EMAIL PROTECTED]> wrote:
>
> I'll try again..
>
> The html
>
> http://www.blue-fly.co.uk/trisco/test.php
>
> the css
>
> http://www.blue-fly.co.uk/trisco/css/
>
>
> The problem is suckerfish goes behind the text (performance and events).
> Any help would be appreciated.
>
> I have had this problem berfore due to the dropdowns being absolutely
> positioned.
>
>
> thanks,
>
>
> Ross
> __
> 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/
>



-- 
•--•--•--•--•--•--•--•--•--•--•--•
Brian Zollinhofer
email: [EMAIL PROTECTED]
website: http://www.zollinhofer.com

"It is better to keep your mouth closed and let people think you are a fool
than to open it and remove all doubt."
- Mark Twain
__
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] absolute positioning bug

[EMAIL PROTECTED] wrote:

>page w/ absolute position works fine in most or all browsers, except IE 6
>is off by one pixel right, and one pixel bottom... anybody know why?
>
>http://www.fatgraffix.com/testing/test-absolute-position/absolute-test.html
>
>
Hi Francis,
I didn't investigate this 1px question, for I think there has te be
thought about some (IMO) more important other things first...

Oops-Help!
If I visit the page in Internet Explorer in my screen resolution of
1280x1024, I see very very small font sizes. And I cannot enlarge them
in IE. - So for lots of visitors the page will be inaccessible...

* Screenshot IE at 1280x1024.

http://home.tiscali.nl/developerscorner/css-discuss/images/screenshot-herbalife-1280x1024.gif
* About 80-85% of the visitors is using IE:
http://www.thecounter.com/stats/2006/September/browser.php
* About 20% is surfing with a 1280x1024 screen size:
http://www.thecounter.com/stats/2006/September/res.php
* And more and more people are buying and using screens > 1280x1024px.
* Then 16-17% of the visitors can have severe accessibility problems
with the fixed font sizes of 11 px and 9 (!) px.

On the other hand, if I visit the page in a resolution of 800x600px, the
page is walking out of the screen on the right side, and I need to use
the horizontal scrollbar to read what is on the page.

* About 16% of the visitors is still using 800x600 screens:
http://www.thecounter.com/stats/2006/September/res.php
* Then these 16% has less usability because of the fixed width of 961px.

On the third hand, if I visit the page in other browsers than IE, in a
resolution of 1280x1024px, I can enlarge the font size. But scaling the
font-size upwards, already in a few steps the text is extending the
header area.

* Screenshot Firefox at 1280x1024, font-size client side enlarged
with 3 steps:

http://home.tiscali.nl/developerscorner/css-discuss/images/screenshot-herbalife-1280x1024-enlarged.gif

All together, I agree cordially with the recommendation of the BrowserNews:

* Recommendation.
A good way to ensure that sites will work for as many resolutions
as possible is to design sites to be resolution-independent, i.e.
not to specify widths in absolute units (e.g. pixels) /unless/ a
width is that of a fixed-width object, e.g. a GIF, JPG, or PNG image.
* http://www.upsdell.com/BrowserNews/stat_trends.htm#res
* As a rule of thumb, I use em's for font-sizes, and % for the width
of a container (and: mostly no div-height! Then the height of the
boxes can grow or shrink together with the font-sizes).
* In the same way, I try to avoid Absolute Positioning as much as
possible: it is fixing the elements; then they cannot shift
upwards or downwards if needed.

To rebuild a site with all fixed styles into a flexible css is not easy.
But everything can be made with css! [1]
So I hope you will consider to make a fresh start ... ;-)

Success and greetings,
francky

[1]
Illustration of flexibility: a page in the Belgian CSS Zen garden
"Gigastyle":

* http://www.gigastyle.be/?cssfile=41/elastico.css
It is not for the beauty of the design, just a test page for
showing possibilities of fluid css coding. You can try different
screen sizes, different window sizes, different font-sizes, and
different browsers.
The page and the comments in the stylesheet are in Dutch, the css
is universal. :-)

Reading stuff for instance:

* The Sizing Text pages of the css-Wiki: http://css-discuss.incutio.com/
* The Float Layouts page of the css-Wiki:
http://css-discuss.incutio.com/?page=FloatLayouts
* http://www.cssliquid.com/
* Not enough? Google for "liquid style css"!

__
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] image not showing up in NS7

PBC Web Design wrote:
> ...
> I have an issue in NS7 on this page:
> 
> http://www.cedarcreekimages.com/new/
> 
> If you view in IE6 or FF, Opera 9 you'll note there is a letter *I* 
> image at the beginning of the first paragraph.  The problem is in NS7 
> the image doesn't show up.  ...

> http://www.cedarcreekimages.com/new/css/cci3columns.css
> 
> #content .imagine p {
>  padding: 10px 5px 20px 35px;
>  background: url(images/letter-I.gif) no-repeat 35px top;
>  font-size: 105%;
>  text-indent: 35px;
> }
> 

Try setting

background: url(images/letter-I.gif) no-repeat 35px 0px;

Specification:

- in CSS2.0:
"Keywords cannot be combined with percentage values or length values"

- in CSS2.1:
"Combinations of keyword, length and percentage values are allowed"

N7 does not follow the newer 2.1 here.

Ingo

-- 
http://www.satzansatz.de/css.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] how to prevent 'stuttering' browser rendering with e.g. images

2006-10-22 Thread Christian Heilmann

> when images (and probably also some div id s) don't get width/height
> set on the page, the rendering in the browser can look 'stuttering'.
> divs and texts appear earlier, images start to appear and push the
> content further down or the side.
>
> another behaviour is that at short pages the scrollbar disappears,
> making a centered content jump offset to the right a bit.
> e.g. I have short pages with few textlines and with one either
> vertical or horiziontal pic. when one clicks through the pages, this
> offset jumping is annoying.
>
> what do you do in such cases?
> - provide a large empty div box in the background with a minimum
> height that makes sure a scrollbar (area) will always  appear?
> - set the margin of a footer div id very high?

That and setting width and height in the image attributes. You can
enforce the scrollbar with a height of 100.01%
http://www.hicksdesign.co.uk/journal/forcing-scrollbars-now-even-better

-- 
Chris Heilmann
Book: http://www.beginningjavascript.com
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
__
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] sukckerfish over text

I'll try again..

The html

http://www.blue-fly.co.uk/trisco/test.php

the css

http://www.blue-fly.co.uk/trisco/css/


The problem is suckerfish goes behind the text (performance and events). Any 
help would be appreciated.

I have had this problem berfore due to the dropdowns being absolutely 
positioned.


thanks,


Ross
__
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] suckerfish should go over text

http://www.blue-fly.co.uk/trisco/test.php

the css
__
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] Page-break-before/IE7... anyone know where we post IE7/CSS bugs now that the beta support is closed?

Alan K. Gay wrote:
> My issue is with print-break-before:always in combination with any page
> contents that have a height spec.  Pagination is ignored.  ...
> This is the sample code that breaks when printed.  Each div should be at the
> top of a page, but they are not.
> 
>  
> Page 1 
>  style="background-color:red;height:600px;">Page 2 
>  style="background-color:red;height:6in;">Page 3 
> 
> 

Inserting "something" before the  seems to fix it in your test case.


   
   Page 2



Ingo

-- 
http://www.satzansatz.de/css.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] IE 7 - Extra padding-top

Nate Kresse wrote:
> Hello All,
>
> I came across a situation where IE7 (fresh copy downloaded today) inserts
> extra padding-top when applied to an element inside a cleared div that comes
> after a floated div. It also seems like it is related to using the shortcut
> to apply a background color.
>
> Check out my test case here:
>
> http://www.stammbt.com/testing/testie7.html
>
> It can be "fixed" a number of ways.
>
> 1. If you add a border to the div with the property: clear:both
> 2. Removing the background property
> 3. Completing the background property shortcut - adding url("image")
> no-repeat 0 0;
> 4. removing the float on the first div
>
> You get the point...
>
> This page displays correct in every browser that I've loaded it into except
> IE7.
>
>
>   
I have no idea what is going on. Or why it is going on. Or what causes 
something to correct it.. Tight coding seemed to yield a consistent result?


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] IE 7 - Extra padding-top

Nate Kresse wrote:
> I came across a situation where IE7 (fresh copy downloaded today) inserts
> extra padding-top when applied to an element inside a cleared div that comes
> after a floated div. It also seems like it is related to using the shortcut
> to apply a background color.  ...
> 
> http://www.stammbt.com/testing/testie7.html
> 
> It can be "fixed" a number of ways.
> 
> 1. If you add a border to the div with the property: clear:both
> 2. Removing the background property
> 3. Completing the background property shortcut - adding url("image")
> no-repeat 0 0;
> 4. removing the float on the first div
...

hmm.

- a padding or
- zoom:1

for #pagehead does fix it too.

Ingo

-- 
http://www.satzansatz.de/css.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] IE7 is stealing my content!

jennifer ham wrote:
...
> http://stalkinggear.com/ie7testcase/what.html
> 
> Nothing inside of .left shows up! ...
> 
> For fun I tried playing with z-indexes. I tried floating everything
> inside .left (blindly hoping maybe this had somethin to do with
> hasLayout). Nothing changes. ...

Disappearance often occurs because an ancestor has no layout.

By giving haslayout to the parent (try zoom:1; for div.content), the 
invisible div.left reappears.

Ingo


-- 
http://www.satzansatz.de/css.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] PVII horz tabbed nav alignment help please

At 04:55 PM 10/20/2006, you wrote:
>CSS is here:
>
>http://www.cedarcreekimages.com/new/p7tbm/p7tbm_center_08.css
>
>Your help would be greatly appreciated.  Thank you.

You can disregard this.  This post was sent a day or two ago and just 
hit the list now.  The issue has been resolved in the mean time.  Thank you!


:: Deb | PBC Web Design
:: http://www.PBCWebDesign.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] image not showing up in NS7

Hello to you all,

I'm new to the list and this is actually my 2nd post. I never did see 
my first post hit the list nor any responses so I'm going to try again.

I'm Deb and it's nice to "meet" all of you. I've been designing for 
about 10-11 years now but always w/tables.  Over the past few years I 
began using more css w/my tabled designs and less "in page" 
old-fashioned coding.  It's just over the past few weeks that I 
ventured into tableless and more use of css.  I'm trying hard to 
learn but it's not easy for me.

The following issue is my 2nd tableless design.  I'm sure those of 
you who do tableless and major css will find it's very simple but for 
me it was a major undertaking.

I have an issue in NS7 on this page:

http://www.cedarcreekimages.com/new/

If you view in IE6 or FF, Opera 9 you'll note there is a letter *I* 
image at the beginning of the first paragraph.  The problem is in NS7 
the image doesn't show up.  I was wondering if someone might have a 
fix for this?

The css file is here:

http://www.cedarcreekimages.com/new/css/cci3columns.css

and the specific rule for this image is:

#content .imagine p {
 padding: 10px 5px 20px 35px;
 background: url(images/letter-I.gif) no-repeat 35px top;
 font-size: 105%;
 text-indent: 35px;
}

Any help you can provide would be greatly appreciated, thank you.

Deb | PBC Web Design
__
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] how to prevent 'stuttering' browser rendering with e.g. images

2006-10-22 Thread Beate De Nijs

Hello,

when images (and probably also some div id s) don't get width/height  
set on the page, the rendering in the browser can look 'stuttering'.
divs and texts appear earlier, images start to appear and push the  
content further down or the side.

another behaviour is that at short pages the scrollbar disappears,  
making a centered content jump offset to the right a bit.
e.g. I have short pages with few textlines and with one either  
vertical or horiziontal pic. when one clicks through the pages, this  
offset jumping is annoying.

what do you do in such cases?
- provide a large empty div box in the background with a minimum  
height that makes sure a scrollbar (area) will always  appear?
- set the margin of a footer div id very high?
- ...

bye,
beate de nijs


__
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] Nested divs, constrain one within the other.

2006-10-22 Thread Mario Merino

http://proximita.com/garnierarq/proyectos-garnier-arquitectos.html

http://proximita.com/garnierarq/garnier.css

Hello, thanks for your time.
In the html page above (table/css) #DivNoTable is the container for
#imgCont, and I cant get #imgCont to constrain itselft to #DivNoTable.  I
want #DivNoTable to grow accordign to #imgCont but haven't been able to do
that so far.
Help would be greatly appreciated.


Proximita Web 
Mario Merino
[EMAIL PROTECTED]
tel: (506) 524-0479
mobile: (506) 843-0482


__
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] some sort of problem.

2006-10-22 Thread Jon Hughes

http://www.phazm.net/stamps/products.html

If you view this page in FF it's fine, but IE kinda... doesn't like it.
I have no idea what's wrong with it though (still learning the IE hacks)
- can someone help me?  (I use digest, so please reply to my email
directly if you can) [EMAIL PROTECTED]

Also, if you can tell me how to bring the "Next Page" up a bit, I would
appreciate it :)

(if you see any other problems not related to what my post is about,
please let me know, I'm trying to learn to code GOOD compliant
xhtml/css.  So I need to know if I'm making a mistake.)

Thanks!

- Jon

__
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 border quirk

2006-10-22 Thread Linda Quinn

Something strange is happening in IE6 (as usual). I am creating a  
page, using Safari/Mac as my default browser - then every time I  
upload a change I check it on PC in IE6/Win. Everything was laid out  
in the correct position on both browsers - the page can be seen at:

www.lifeonwheels.com/beta2.

Under the heading are two columns, followed by a footer. At this  
point the right column is complete, and I am still adding the left  
column content. To help in troubleshooting, I originally placed a  
border around the entire page and around the two columns. I removed  
both borders to see how things looked - and in IE6/Win the left  
column moved under the right column. Turned out that the border  
around the two columns is creating the problem. If I remove it (first  
line in #colunmwrapper, below) or, if I put in a column style of  
"none", the problem occurs.

#columnwrapper {
border:0.1em solid white;
border-bottom:5px solid #c90;
padding-bottom:5px;
position:relative;
}

Since my client was going to be viewing the page this weekend, I put  
in an invisible border, reflected in the CSS rule above. Note that  
the border-bottom (line 2) is part of the design.

Question - why would removing the border declaration cause the entire  
left column to move? It was my understanding that a border is not  
part of the actual container, only an outline. FYI, the initial CSS  
rule for the left column is:

#leftcolumn {
position:absolute;
width:690px;
overflow:hidden;
}

Any help in understanding why this is happening would be appreciated.  
Thanks, LindaQ
__
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] floats, fieldsets, and margins

Matt Tibbits wrote:

>[...]
>"http://www.tibbits.ca/webdev/test.php"http://www.tibbits.ca/webdev/test.php
>
>It doesn’t seem to matter whether or not there is text floated to the left
>of this nested fieldset element. I’m thinking that it probably has something
>to do with the preceeding inline element occurring in the form of a legend
>tag…but not really sure. 
>
>Can someone explain to me why this happens? Any suggestions on how to fix it
>would also be welcome.
>  
>
Hi Matt,
I didn't get the stream of css-d mails the last day, so there is a 
retard somewhere and maybe I'm too late. ;-)
- I cannot explain the "why?", but did some playing with margins and 
paddings.
The result is this:

* Testpage 1

It is working in FF1.07 and IE6 on Win98SE, but ... not in Opera(8.01), 
while the original didn't come through in Opera either.

* See Opera-sceenshot

.

Floating the inner fieldset doesn't help. Seems Opera just cannot manage 
nested fieldsets.
Then I removed the outer fieldset, and replaced it by an alternative 
"common styling". The result is this:

* Testpage 2

Now working in Opera8.01 too! And according to browsershots: in Opera9, 
in Safari on Mac, in FF1.5 on Linux, in IE7 on Win, and Konqueror on 
Linux: too! [1]
:-) See:

* 
http://browsershots.org/website/http://home.tiscali.nl/developerscorner/css-discuss/test-tibbits_form-legend-2.htm

I hope you can use some of this.

Succes and greetings,
francky

[1] for some of them fine tuning of the width of the form box (or input 
width) is needed.

__
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] clearing logo in print output

2006-10-22 Thread Maren Child

This is so silly, I can't clear the logo in the print output. I did have 
it, briefly and only in Firefox, but then I changed something to fix it 
in IE and it's not clearing again.

I can't see why the clearing div isn't working, since it works on the 
screen.

Thanks
Maren

__
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] page check!!

2006-10-22 Thread Administration

Hi list,

Cross browser check please.

http://www.highburytearooms.com.au
http://www.highburytearooms.com.au/highbury.css

There are a couple of errors that I am aware and I would like some help 
in sorting them out.

IE 6.0 two layers not showing up . I have fooled around with z-index  
etc to no avail.

FF 1.5 All seems to be in order and rendering ok

Opera 9.0 I have an ongoing prob with font size ... view > zoom > is set 
at 100%
also an unwanted background color showing up on the h4 tags

Thanks in advance,

Keno.
__
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 7 - Extra padding-top

2006-10-22 Thread Nate Kresse

Hello All,

I came across a situation where IE7 (fresh copy downloaded today) inserts
extra padding-top when applied to an element inside a cleared div that comes
after a floated div. It also seems like it is related to using the shortcut
to apply a background color.

Check out my test case here:

http://www.stammbt.com/testing/testie7.html

It can be "fixed" a number of ways.

1. If you add a border to the div with the property: clear:both
2. Removing the background property
3. Completing the background property shortcut - adding url("image")
no-repeat 0 0;
4. removing the float on the first div

You get the point...

This page displays correct in every browser that I've loaded it into except
IE7.



__
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] IE7 is stealing my content!

2006-10-22 Thread jennifer ham

I don't know how else to describe it. Even my super simple testcase
features the awesome new issue I have discovered.

http://stalkinggear.com/ie7testcase/what.html

Nothing inside of .left shows up! I'm not entirely certain if it's
taking up space or not, but I can tell you that it's not missing, it's
more like, invisible. There's a text link in the left hand side, if
you mouse over it, you'll get the hand cursor, heck, you can even
click on it, and it will take you away!

For fun I tried playing with z-indexes. I tried floating everything
inside .left (blindly hoping maybe this had somethin to do with
hasLayout). Nothing changes.

CSS is embedded. HTML and CSS validate (exception of it's dislike of
my use of 'orange' but the problem was happening without that too, and
I *like* orange.)

Any thoughts, suggestions, musings, etc are greatly appreciated!

jen
__
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] PVII horz tabbed nav alignment help please

Hello,

I'm Deb and am brand new to this group as of a few days ago.  I have 
been a very basic css w/tables user for several years and the past 
year I've ventured into more use of css trying to learn something new 
and apply it as often as possible.  I just am getting into table-less 
design so I'm very green at both table-less design and the css that 
goes w/it.  I rather feel like a fish out of water w/o my 
tables.  The design in question is my second table-less design.  It's 
very simple (I guess!) but it's a start.

Was wondering if a few of you folks would have a look at my problem 
that I haven't been able to get worked out.

I bought me a treat today - the PVII Horizontal Tabbed Nav :)  I have 
it installed on this page: http://www.cedarcreekimages.com/new/ it 
would be the secondary nav holding the portfolio, bio, etc ... 
links.  Rollover them to view the "drop downs."

 From my end it looks good in FF, Opera 9 and NS7 - but gee - never 
fear - IE is here to spoil my fun :( When you mouseover the drop down 
links slide wa over to the right and I haven't been able to get 
them where they belong.  You can see how they're supposed to be by 
viewing in the other browsers.

CSS is here:

http://www.cedarcreekimages.com/new/p7tbm/p7tbm_center_08.css

Your help would be greatly appreciated.  Thank you.


Deb | PBC Web Design


__
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] Page-break-before/IE7... anyone know where we post IE7/CSS bugs now that the beta support is closed?

2006-10-22 Thread Alan K. Gay

My issue is with print-break-before:always in combination with any page
contents that have a height spec.  Pagination is ignored.   Submitted about
45 days ago to the MS beta feedback site, and also to 
http://groups.google.com/group/microsoft.public.internetexplorer.general/bro
wse_thread/thread/128625a5b4dc25ff/f189bcf7f90f0d4f?lnk=st&q=&rnum=1&hl=en&

This is the sample code that breaks when printed.  Each div should be at the
top of a page, but they are not.

 
Page 1 
Page 2 
Page 3 


Other than standing on a street corner with a sign, not sure what to do.
Depressing to have stuff that has worked for years broken.
Page-break-after seems to be OK, but it's not quite the same... Sometimes
the stuff "before" doesn't know what comes next... So don't know whether to
force a page break after or not. 

Alan K. Gay 
[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] h2 tags with padding don't hover properly

[EMAIL PROTECTED] wrote:

>see link below with two menus:
>
>- http://www.fatgraffix.com/hrblshop-dev/shop_dev19/
>
>1) in first menu, hover of main headings (h2 tags) work fine as long as
>zero padding is applied to the h2 tags
>
>2) in second menu, hover of h2 tags don't catch the padded areas of the h2
>tags seems that the hover should apply to the padded areas, but they don't
>(on windows IE, firefox and opera)...
>
>i'm pretty sure that hovers usually work over list items with padding, but
>why not h2 tags ??
>
Hi Francis,
It is the definition of what a padding is. The simplified explication 
[1]: it is the space between an element an the element inside.
In your case, if the element is the h2, and you give a padding to the 
h2, the embedded element (the ...) will start at the distances 
given by the padding. The background of the  element is displaying 
only there (if it is a normal background or a hovering one doesn't matter).
See image of screenshot with other paddings of the h2:

* 
http://home.tiscali.nl/developerscorner/css-discuss/images/test-1_dev19c.gif

If you hover over the  element, only the (yellow) background of that 
element is changed; not the background of the surrounding h2. [2]

Now if you want the hovering background color for the whole h2 space, 
you can set all paddings of the h2 to zero, and give the padding to the 
 element. Then the background of the  is filling the background of 
the whole , and thus @hover of the  is changing all.
See image of screenshot with padding to the :

* 
http://home.tiscali.nl/developerscorner/css-discuss/images/test-2_dev19c.gif
  :-)

If you want some more space between the search box and the first h2, you 
can apply a border-bottom to a search box element:

* 
http://home.tiscali.nl/developerscorner/css-discuss/images/test-3_dev19c.gif

Succes and greetings,
francky

[1] w3c-specs: http://www.w3.org/TR/CSS21/box.html#box-dimensions
[2] unless you make an at-hover changing backgound for the h2; but then 
IE doesn't understand (because the h2 itself is not an ).
__
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] Inaccesible column items

2006-10-22 Thread Pablo

Hi everyone!

This is not a specificaly css related topic, but has a lot to do with
it. I'm using DirectX filters to render the png alpha layers on IE. I'm
used it in several elements but when it comes to the column that
contains the search and links sections something weird happens.

I can't select, click or hover any of the links nor write in the text
box or push the search button. It's like there was a layer or coat
preventing me from touching anything inside the element. I've run some
tests and (as long as any of you says I'm wrong) is the filter who's
causing all this mess. Whenever I remove it the element and its clidren
behave normaly. 

Can you please help me? Thank you very much

Here's the code

CSS:


> .columnaD {
> float: left;
> margin: 0 0 0 20px;
> padding:0;
> width:250px;
> height: 1430px;
> background: url('./Imagenes/columna_links.png') no-repeat;
> text-align: left;
> }
> * html .columnaD{
> margin-left: -25px ;
> background-image: url(blank.gif);
> filter: 
> progid:DXImageTransform.Microsoft.AlphaImageLoader(src="./Imagenes/columna_links.png",
>  sizingMethod="scale");
> 
> }

HTML:



List of links...
List of links...
List of links...
...



__
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] "margin: 0 auto" and "float" dont work together

2006-10-22 Thread Ed Seehouse

On 10/20/06, Martin Breuer <[EMAIL PROTECTED]> wrote:
> Hi,
> I have one div with static width and height and a dynamic content from
> on to three divs with static width and height which have to be centered.
> To get them in one line, I use float: left. To center them I tried
> margin: 0 auto;
> But it doesn't work. Margin: 0 auto OR float: left.

It shouldn't work either, if my understanding of CSS is close to
correct.  Floating an object removes it from the normal flow of
elements so it has no reference point for centering itself to
anything.

There is, unfortunately perhaps, no "float: center;" rule.
__
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] floats, fieldsets, and margins

2006-10-22 Thread Zoe M. Gillenwater

Matt Tibbits wrote:
> I have a fieldset within a fieldset, I cannot put a top margin on the nested
> fieldset. 
>
> Here’s a silly little example: HYPERLINK
> "http://www.tibbits.ca/webdev/test.php"http://www.tibbits.ca/webdev/test.php
>
> It doesn’t seem to matter whether or not there is text floated to the left
> of this nested fieldset element. I’m thinking that it probably has something
> to do with the preceeding inline element occurring in the form of a legend
> tag…but not really sure. 
>   

Actually, when I removed the float on the label, it *did* recognize top 
margin in FF, so it seems to me it does matter whether there is text 
floated to the left of the fieldset. Now, whether it should matter is a 
different story. I don't think it should. I don't have time to test on 
other browsers to see where exactly this bug occurs. (Could you post a 
page with a top margin on the nested fieldset so it's easier to test 
please?)

But I think you can change your markup and avoid the whole problem. You 
shouldn't have a label element sitting outside of a fieldset -- it can't 
label the fieldset. That's what the legend element is for. So, just get 
rid of that label entirely and make its text the legend of the nested 
fieldset instead of the "select one" text that is there now.

Zoe

-- 
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu

__
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 and stacking order

2006-10-22 Thread Mike Davies

I am trying to get my head around the concept of stacking order, so far
unsuccessfully.

I have a site at www.cromartyview.com. I would like the thistle image,
which is a background image on #wrapper to appear over the main image,
#headimage which is in div#container.

I think my problem is in working out which stacking context each is in
and how to use the z-index to change the stacking order.

Any help appreciated.

Regards,
Mike Davies
-- 
Mike Davies
Integra Web Design, Huntly, AB54 4XP
01466 700213www.integrawebdesign.co.uk

__
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] IE6 or IE7 Standalones

2006-10-22 Thread Storm, Dan

If this is off topic, please accept my apologies reply off-list.

Like many of you, I would like IE6 and IE7 on the same box. I've been told that 
standalones of the IE browsers don't guarantee the same display/performance as 
the integrated versions because of shared DLLs, i.e. there is no true 
separation. 

Comments?

dan storm ~ web developer ~ amazon.com ~ w: 206.266.0292 ~ c: 425.503.9580
__
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 positioning bug

2006-10-22 Thread [EMAIL PROTECTED]

page w/ absolute position works fine in most or all browsers, except IE 6
is off by one pixel right, and one pixel bottom... anybody know why?

-
http://www.fatgraffix.com/testing/test-absolute-position/absolute-test.html

thanx all.

=fgx=
[EMAIL PROTECTED]


mail2web - Check your email from the web at
http://mail2web.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 problem

2006-10-22 Thread Zoe M. Gillenwater

Tee G. Peng wrote:
> Hi, I am doing a page that I can't change the markup and source order  
> (think CSS zen garden!),  and is facing a problem with background image.
>
> The markup looks like so
>
>  with background image in the footer div 
>
> 
>
> CSS:
>
> #wrap {
>   background: url(images/content-bg.png) repeat-y ;
>   width:914px;;
>   margin:80px auto 0 auto;}
>
> #footer {
>   clear: both;background: url(images/ftr-bg.png) no-repeat left bottom;
>   text-align: center;}
>
> The wrapper background image goes all the way down which is great  
> but  it goes beyond the footer. I need the footer image sticks to the  
> bottom.
>   

You need the footer to stick to the bottom of the wrapper? In that case, 
position the wrapper relatively, then position the footer absolutely and 
give it a bottom value of 0. Full CSS at:
http://scott.sauyet.com/CSS/Demo/FooterDemo1.html
http://solardreamstudios.com/learn/css/footerstick/
(both the same)

There is a less buggy way of making a footer stick, but it requires 
placing the footer outside the wrapper, so it won't work for you. The 
method referenced above should work for most cases, so I wouldn't worry 
too much about it.

Zoe

-- 
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu

__
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] SOS almost there

2006-10-22 Thread Schalk Neethling

Greetings All,

I am using son of suckerfish for my menu and I am almost there. I have 
gotten the drop downs to not be all the way over to the right but, they 
are still not below the top nav button/link as it should be (IE). Can 
someone please have a look and let me know where I am going wrong. Thanks!

http://www.jcislord.org/index.php
http://www.jcislord.org/templates/jcil/css/template_css.css
http://www.jcislord.org/templates/jcil/css/ie.css

All help appreciated.
Schalk

__
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] h2 tags with padding don't hover properly

2006-10-22 Thread [EMAIL PROTECTED]

ok - try the pages directly:

- http://www.fatgraffix.com/hrblshop-dev/shop_dev19/dev19b_menu-only.html
- http://www.fatgraffix.com/hrblshop-dev/shop_dev19/dev19c_menu-only.html

thanx! sorry to confuse you...

=fgx=
[EMAIL PROTECTED]


Original Message:
-
From: Roger Roelofs [EMAIL PROTECTED]
Date: Fri, 20 Oct 2006 14:06:49 -0400
To: [EMAIL PROTECTED]
Subject: [SPAM] Re: h2 tags with padding don't hover properly


Francis,

On Oct 20, 2006, at 1:53 PM, [EMAIL PROTECTED] wrote:

> note: links for this subject are at:
> - http://www.fatgraffix.com/hrblshop-dev/shop_dev19/
>
> hey roger... style sheets for above pages are at:
> - http://www.fatgraffix.com/hrblshop-dev/shop_dev19/new-menu.css
> - http://www.fatgraffix.com/hrblshop-dev/shop_dev19/new-menu-19c.css
>
> also roger - note that in IE the hovers of the menu work over the  
> entire
> button area not just the text by using the * html hack - look at  
> the bottom
> of the stylesheet.
>
> for reference, here's my original question:
>
>> 1) in first menu, hover of main headings (h2 tags) work fine as
>> long as zero padding is applied to the h2 tags
>>
>> 2) in second menu, hover of h2 tags don't catch the padded areas of
>> the h2 tags
>>
>> seems that the hover should apply to the padded areas, but they
>> don't (on windows IE, firefox and opera)...
>>
>> i'm pretty sure that hovers usually work over list items with
>> padding, but why not h2 tags ??

There are no link elements or imported style sheets in the document at
 when viewed with  
Flock (a firefox 1.5 variant)

Is it possible your server is checking user agent strings and serving  
different content to each one?

Roger,
-- 
Roger Roelofs
[EMAIL PROTECTED]






mail2web - Check your email from the web at
http://mail2web.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] h2 tags with padding don't hover properly

2006-10-22 Thread [EMAIL PROTECTED]

note: links for this subject are at:
- http://www.fatgraffix.com/hrblshop-dev/shop_dev19/

hey roger... style sheets for above pages are at:
- http://www.fatgraffix.com/hrblshop-dev/shop_dev19/new-menu.css
- http://www.fatgraffix.com/hrblshop-dev/shop_dev19/new-menu-19c.css

also roger - note that in IE the hovers of the menu work over the entire
button area not just the text by using the * html hack - look at the bottom
of the stylesheet.

for reference, here's my original question:

> 1) in first menu, hover of main headings (h2 tags) work fine as
> long as zero padding is applied to the h2 tags
>
> 2) in second menu, hover of h2 tags don't catch the padded areas of
> the h2 tags
>
> seems that the hover should apply to the padded areas, but they
> don't (on windows IE, firefox and opera)...
>
> i'm pretty sure that hovers usually work over list items with
> padding, but why not h2 tags ?? 

=fgx=
[EMAIL PROTECTED]



mail2web - Check your email from the web at
http://mail2web.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] Conditional (x)HTML

[EMAIL PROTECTED] wrote:
> I'm building a site where I'm trying to keep "content first" in the
> source. [mega trim] 
>   
I guess I am missing something? Twenty-eight of the 40 layouts on this 
page  are three column layouts with the 
content fist in the source order. They work well cross-browser. No hacks 
required for ie (providing you play your cards right and avoid the box 
model hacks by keeping horizontal padding and vertical borders off width 
bearing containers when you add /your/ content).
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] Specifying CSS definition via HTML attributes & IE6

2006-10-22 Thread Alex Robinson

>Attribute selectors are part of CSS 2.
>http://www.w3.org/TR/CSS2/selector.html#attribute-selectors


Whoops - David is absolutely right. It was only Substring matching 
attribute selectors that got added in CSS3. I plain forgot that 
attribute selectors predated that.
__
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] thanks and gallery links wanted