Re: [css-d] better CSS option to group image/content

[Jukka K. Korpela]

On Tue, 17 Apr 2007, Paul Novitski wrote:

> Many people use the definition list for image/caption pairs (although
> there's disagreement over whether an image and its caption qualify as
> a term and its description; personally I don't have a problem with
> the metaphor).

But image captions are a different issue, aren't they? The question seems 
to deal with the use of a floated image on the right or left of some text 
paragraph (content content). If the image has a caption, there's an 
additional problem (with quite a many possible solutions, none of which is 
perfect).

I think we first need to understand what the problem and goal is.

-- 
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] CSS :hover effect causing the container element to disappear?

[Big John]

Rowan wrote:

> A visitor of www.stichting-ecosafe.org told me that when he hovers over the
> menu of that website, the whole menu disappears. I'm assuming he's using
> some version of Internet Explorer to which I don't have access, because in
> all the browsers I tested on, I can't seem to reproduce the effect... I'm
> startled. The only CSS effect I use is that I change the background image of
> the links in the menu when the visitor hovers over them (the bullets are
> done using background images).

Avoid using a big body margin to make space; it risks bugs such as
this one. Instead employ interior divs for the same purpose. 

I think you can put a left margin on #content to keep it out from 
behind the AP left col.

Big John



-- 
Perennial student + Impractical joker + CSS junkie = Big John


__
Do You Yahoo!?
Tired of spam?  Yahoo! Mail has the best spam protection around 
http://mail.yahoo.com 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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 Bug (6&7): Absolutely positioned element takes up vertical space

[Big John]

Dave Simon wrote:

> I have a menu that is essentially a group of nested lists:
- snip - 
> Depending on the page you are on, the sub menus show or hide.  
> ul#details-floorplans-nav is absolutely positioned and set to  
> display:none unless the body class is "details."
> 
> When the body class is "details", it's set to display:inline.
> 
> See it in action here: 
> http://www.advertisingdesign.com/adclient/12trails/subpage.php

> The bug only occurs in IE, in every version tested - 5.5, 6, 7

It's the way you reveal the UL. Why display: inline;? If you let the 
UL stay "block" then IE won't have the bug. Use display: block; instead
of display: inline;.

What's interesting is that I believe AP elements are required to be block
at all times just like floats are, but then display: inline; does 
fix the IE doubled margin bug. So we know IE doesn't completely ignore
display: inline; in that case, nor apparently in this one. Hm...

Big John



-- 
Perennial student + Impractical joker + CSS junkie = Big John


__
Do You Yahoo!?
Tired of spam?  Yahoo! Mail has the best spam protection around 
http://mail.yahoo.com 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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] better CSS option to group image/content

[Paul Novitski]

At 5/17/2007 06:56 PM, Bob Meetin wrote:
>I commonly do something like:
>
>.clear {margin: 0; padding: 0; border: 0; }
>
>
> 
>   
>   content content
>  
>
>
> 
>   
>   content content
>  
>
>All this to keep  images horizontally aligned with corresponding data,
>be it left or right. Is there a cleaner way to do this with CSS than
>fieldset/legend? Works great but seems like overkill. If I do this in an
>ordinary div, if the image is large and there is not enough content it
>just pushes its way out of the box.  Missing something?


FIELDSET and LEGEND are intended for use with input forms:

HTML 4.01 Specification
17 Forms
17.10 Adding structure to forms: the FIELDSET and LEGEND elements
http://www.w3.org/TR/html4/interact/forms.html#h-17.10

Many people use the definition list for image/caption pairs (although 
there's disagreement over whether an image and its caption qualify as 
a term and its description; personally I don't have a problem with 
the metaphor).  Google CSS DEFINITION LIST GALLERY for many examples 
and discussions.

You could also place an image and a paragraph in each list item of an 
unordered list.

In any case you ought to be able to float the images right or left of 
the captions with CSS rather than with inline presentational 
attributes in the markup.

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] better CSS option to group image/content

[Jukka K. Korpela]

On Thu, 17 May 2007, Bob Meetin wrote:

> I commonly do something like:
>
> .clear {margin: 0; padding: 0; border: 0; }
>
> 
>
>  
>  content content
> 
>
> 
>
>  
>  content content
> 

A URL would be most useful, since the markup looks odd and it's difficult 
to see what the approach aims at. When I test a simple case, I see 
strangly aligned images.

> All this to keep  images horizontally aligned with corresponding data,
> be it left or right.

Aligned in which sense? The images appear as flushed right or left but 
_vertically_ aligned higher than the top of the text paragraph.
Is that really what you want?

> Is there a cleaner way to do this with CSS than
> fieldset/legend? Works great but seems like overkill.

It sounds rather illogical and risky, since you are not grouping form 
fields, and the rendering of  and  is idiosyncratic. 
Even if current browsers gave you consistent appearance, the rendering 
might change in the next version. Form-related elements have changed their 
appearance - compare e.g. the simple rectangular gray buttons in some 
environements with rounded-corner light buttons in others.

> If I do this in an
> ordinary div, if the image is large and there is not enough content it
> just pushes its way out of the box.  Missing something?

I'm missing a URL or two...

Wild guess: Your problem is caused by lack of clearing the flow before 
starting a new block with a floated image, and in some environments, 
 happens to cause clearing.

-- 
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] Image won't stay still when text scrolls...

[Big John]

Scott wrote:

> For some unknown reason to me, FF & IE just don't like to play nice
> with www.CDROP.org.  If I get it right in FF, IE breakright in IE,
> FF breaks
> 
> Can someone please tell me what I'm doing wrong at www.CDROP.org?
> 
> All I want to do is have the picture on the right (the curved images
> to the right of the text) stay in one place, and let the text
> scrolland do it all with just CSS.

I just checked in IE5.5+, FF2 and Op9, and they are all fine.
Are you sure it's not some local issue?

Big John



-- 
Perennial student + Impractical joker + CSS junkie = Big John


__
Do You Yahoo!?
Tired of spam?  Yahoo! Mail has the best spam protection around 
http://mail.yahoo.com 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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] better CSS option to group image/content

[Bob Meetin]

I commonly do something like:

.clear {margin: 0; padding: 0; border: 0; }



  
  content content
 



  
  content content
 

All this to keep  images horizontally aligned with corresponding data, 
be it left or right. Is there a cleaner way to do this with CSS than 
fieldset/legend? Works great but seems like overkill. If I do this in an 
ordinary div, if the image is large and there is not enough content it 
just pushes its way out of the box.  Missing something?

-Bob

__
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 won't stay still when text scrolls...

[Mauricio Samy Silva]

Hi Scott,
Let's do a little change in your CSS.
Use the following rules for div#content

div#content {
  height: 397px; 
  overflow: auto; 
  background: url('images/index_03.jpg') no-repeat top right;
  padding-right: 270px;
 }

Mauricio Samy Silva


- Original Message - 
From: "Scott Mailing List" <[EMAIL PROTECTED]>
To: "thelist" <[EMAIL PROTECTED]>; 
Sent: Wednesday, April 18, 2007 12:57 AM
Subject: [css-d] Image won't stay still when text scrolls...


> For some unknown reason to me, FF & IE just don't like to play nice
> with www.CDROP.org.  If I get it right in FF, IE breakright in IE,
> FF breaks
> 
> Can someone please tell me what I'm doing wrong at www.CDROP.org?
> 
> All I want to do is have the picture on the right (the curved images
> to the right of the text) stay in one place, and let the text
> scrolland do it all with just CSS.
> 
> Anyone have any suggestions?  Any help would be greatly appreciated.
> My blood pressure will thank you too :)
> 
> Thanks!
> 
> Scott
> 
> -- 
> Scott
> Hire A Web Geek - "Helping Businesses Grow Online"
> http://www.hireawebgeek.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/

Re: [css-d] Mouseover problem

[Portman]

Oh duh! Sorry.  I see what you are talking about now.

Thanks.

ella wrote:
>  
> You specified the Hoover image in the hack for IE but otherwise
>  You didn't specified a Hoover image in the code for Hoover
> A:Hoover { background-image: URL('images/green_tenis_over.gif'}
> __
> 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] Image won't stay still when text scrolls...

[Scott Mailing List]

For some unknown reason to me, FF & IE just don't like to play nice
with www.CDROP.org.  If I get it right in FF, IE breakright in IE,
FF breaks

Can someone please tell me what I'm doing wrong at www.CDROP.org?

All I want to do is have the picture on the right (the curved images
to the right of the text) stay in one place, and let the text
scrolland do it all with just CSS.

Anyone have any suggestions?  Any help would be greatly appreciated.
My blood pressure will thank you too :)

Thanks!

Scott

-- 
Scott
Hire A Web Geek - "Helping Businesses Grow Online"
http://www.hireawebgeek.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] Mouseover problem

[ella]

 
You specified the Hoover image in the hack for IE but otherwise
 You didn't specified a Hoover image in the code for Hoover
A:Hoover { background-image: URL('images/green_tenis_over.gif'}
__
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] Mouseover problem

[Portman]

Hi all,

I have a client who will be appearing on TV tomorrow and the image 
mouseovers I put on her page are not visible on Mac (I think) and 
browsers other than IE. Can someone point me in the right direction to 
find more info about this? The site is www.littleracquets.com.

Thanks,
Riva
__
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] yet another drop down menu

[Roger Keays]

jeffrey morin wrote:
> hi everyone,
> 
> sorry in advance for the stupid questions but i am not grasping how to get
> the drop down menu to work in ie.

Did you see the article I posted to this list just yesterday?
http://www.sunburnt.com.au/publications/design/css_menus

Hope it helps.

> 
> here is my link:
> http://bioneutrix.com/about_bioneutrix.htm
> 
> the javascript is in the head section and i got that from this article:
> http://alistapart.com/articles/horizdropdowns
> 
> unfortunately i can't get it to work right. the drop down will appear but i
> can't hover over it and navigate through the links.
> can someone please help me on this it's driving me nuts.
> 
> Thanks in advance,
> 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/
> 


-- 

Ninth Avenue Software
p: +61 7 3137 1351 (UTC +10)
f: +61 7 3102 9141
w: http://www.ninthavenue.com.au
e: [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/

[css-d] IE Bug (6&7): Absolutely positioned element takes up vertical space

[Dave Simon]

Long time reader, first time caller. Ha ha.

Anyway, here's my issue:

I have a menu that is essentially a group of nested lists:


About 12 Trails Edge
Details & Floor  
Plans

Unit Description & 
Information
Floorplans


Location

Vicinity Map
Mountain Village Map


Features/Amenities
Living Connected


Depending on the page you are on, the sub menus show or hide.  
ul#details-floorplans-nav is absolutely positioned and set to  
display:none unless the body class is "details."

When the body class is "details", it's set to display:inline.

See it in action here: http://www.advertisingdesign.com/adclient/ 
12trails/subpage.php
To see the menu on other pages: http://www.advertisingdesign.com/ 
adclient/12trails/

The bug only occurs in IE, in every version tested - 5.5, 6, 7 - so  
those of you with a PC handy, take a look at the subpage.php. See how  
there is suddenly a gap between "Details & Floor Plans" and  
"Location"? This is where the newly displayed ul appears in the  
source. But it shouldn't since the element is absolutely positioned...

Why would this occur since absolute elements should take up no space  
at all since they are out of the document flow? And how can I solve  
it (other than the obvious IE stylesheet, which I would prefer not to  
do.)

I've tried taking out whitespace and screwing with heights and  
margins. Thing is, this gap is still there no matter what...

Thanks for any help!

I'll check the list, but any replies that could be sent directly to  
[EMAIL PROTECTED] would be appreciated since I subscribe to  
this list from a personal email, not a work one.
__
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] Best method to have containers wrap around floats inALL browsers.

[Christopher Blake]

I agree with Teressa.

So far I have used the clear div that Teressa encouraged me to try  
again and it works. I read this article and thought that the  
technique might have the upper hand until I read the warning about  
wc3 validation towards the end. I'm sure it will be the best solution  
and I will try it out soon. I learnt something about hacks too, which  
is something that I am beginning  to realize that I must learn.

Thank you both.





Christopher Blake
[EMAIL PROTECTED]
07816163420



On 17 Apr 2007, at 19:40, Teressa Terry wrote:

> Very enlightening; I hadn't seen that before. Thanks!
>
> Teressa
> Graphic & Web Designer
> Opactive
>
> *-Original Message-
> *From: [EMAIL PROTECTED]
> [mailto:[EMAIL PROTECTED] On
> *Behalf Of David Hucklesby
> *Sent: Monday, April 16, 2007 6:02 PM
> *To: Christopher Blake; css-d
> *Subject: Re: [css-d] Best method to have containers wrap around  
> floats
> inALL browsers.
> *
> *On Mon, 16 Apr 2007 17:44:47 +0100, Christopher Blake wrote:
> *>
> *> I don't know whether things are working or not. I do not want to  
> add
> java to get over
> *> this problem, the empty "clear both" div doesn't seem to work  
> for me
> so I am running
> *> out of options.
> *>
> *> Does anyone know a proven method of achieving the result that I  
> want
> that works across
> *> all browsers.
> *>
> *You have options. The one Teressa gave is a good one.
> *This entry at P.I.E. has been updated for IE7, and explains all:
> *
> *
> *
> *
> __
> 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] right-nav out on IE6

[Brian Cummiskey]

Gunlaug Sørtun wrote:
> Kill that 'margin-doubling on floats' bug, by adding...
>
> #rsidebar {display: inline;}
>
> ...and IE6 will behave as intended.
>
> regards
>   Georg
>   

Thanks Georg,

I put the code in, but unfortunately i don't have ie6 at my disposal 
here at the office.  Will have to wait until i get home to test to see 
if it is indeed fixed.

Thanks again :)

-Brian
__
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] Best method to have containers wrap around floats inALL browsers.

[Teressa Terry]

Very enlightening; I hadn't seen that before. Thanks!

Teressa
Graphic & Web Designer
Opactive

*-Original Message-
*From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On
*Behalf Of David Hucklesby
*Sent: Monday, April 16, 2007 6:02 PM
*To: Christopher Blake; css-d
*Subject: Re: [css-d] Best method to have containers wrap around floats
inALL browsers.
*
*On Mon, 16 Apr 2007 17:44:47 +0100, Christopher Blake wrote:
*>
*> I don't know whether things are working or not. I do not want to add
java to get over
*> this problem, the empty "clear both" div doesn't seem to work for me
so I am running
*> out of options.
*>
*> Does anyone know a proven method of achieving the result that I want
that works across
*> all browsers.
*>
*You have options. The one Teressa gave is a good one.
*This entry at P.I.E. has been updated for IE7, and explains all:
*
*
*
*
__
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] yet another drop down menu

[jeffrey morin]

On 4/17/07, Ian Young <[EMAIL PROTECTED]> wrote:
>
>
> > To: CSS
> > Subject: [css-d] yet another drop down menu
> >
> >
> > hi everyone,
> >
> > sorry in advance for the stupid questions but i am not grasping how to
> get
> > the drop down menu to work in ie.
> >
> > here is my link:
> > http://bioneutrix.com/about_bioneutrix.htm
> >
> > the javascript is in the head section and i got that from this article:
> > http://alistapart.com/articles/horizdropdowns
> >
> > unfortunately i can't get it to work right. the drop down will
> > appear but i
> > can't hover over it and navigate through the links.
> > can someone please help me on this it's driving me nuts.
> >
> >
> Know the feeling. dropdowns are a pin in the proverbial.
>
> Couple of thnings strike me about this. The javascript has not been made
> conditional for IE6 which means that all the browsers will implement it.
> The
> list breaks in IE6 (probably a padding/margin/width thing). However, why
> reinvent the wheel. Stu Nichols has all the stuff you need.
> http://www.cssplay.co.uk/menus/drop_examples.html
>
> Good luck
>
> Ian
> --
> No virus found in this outgoing message.
> Checked by AVG Free Edition.
> Version: 7.5.446 / Virus Database: 269.5.1/764 - Release Date: 17/04/2007
> 04:43
>
>
thanks Ian, i will read this page. it looks very detailed which is exactly
what i need

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/

[css-d] CSS :hover effect causing the container element to disappear?

[BigSmoke]

A visitor of www.stichting-ecosafe.org told me that when he hovers over the
menu of that website, the whole menu disappears. I'm assuming he's using
some version of Internet Explorer to which I don't have access, because in
all the browsers I tested on, I can't seem to reproduce the effect... I'm
startled. The only CSS effect I use is that I change the background image of
the links in the menu when the visitor hovers over them (the bullets are
done using background images).

If anyone can reproduce the problem in any browser, I'd be very much
obliged.

  - Rowan

-- 
Morality is usually taught by the immoral.
__
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] yet another drop down menu

[Ian Young]

> To: CSS
> Subject: [css-d] yet another drop down menu
>
>
> hi everyone,
>
> sorry in advance for the stupid questions but i am not grasping how to get
> the drop down menu to work in ie.
>
> here is my link:
> http://bioneutrix.com/about_bioneutrix.htm
>
> the javascript is in the head section and i got that from this article:
> http://alistapart.com/articles/horizdropdowns
>
> unfortunately i can't get it to work right. the drop down will
> appear but i
> can't hover over it and navigate through the links.
> can someone please help me on this it's driving me nuts.
>
>
Know the feeling. dropdowns are a pin in the proverbial.

Couple of thnings strike me about this. The javascript has not been made
conditional for IE6 which means that all the browsers will implement it. The
list breaks in IE6 (probably a padding/margin/width thing). However, why
reinvent the wheel. Stu Nichols has all the stuff you need.
http://www.cssplay.co.uk/menus/drop_examples.html

Good luck

Ian
--
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.5.446 / Virus Database: 269.5.1/764 - Release Date: 17/04/2007
04:43

__
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] right-nav out on IE6

[Gunlaug Sørtun]

Brian Cummiskey wrote:
> ... How can I get IE6 to follow into the layout following the rule of
>  the wrapper's width?

> http://tinyurl.com/2n94pd

Kill that 'margin-doubling on floats' bug, by adding...

#rsidebar {display: inline;}

...and IE6 will behave as intended.

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] yet another drop down menu

[jeffrey morin]

hi everyone,

sorry in advance for the stupid questions but i am not grasping how to get
the drop down menu to work in ie.

here is my link:
http://bioneutrix.com/about_bioneutrix.htm

the javascript is in the head section and i got that from this article:
http://alistapart.com/articles/horizdropdowns

unfortunately i can't get it to work right. the drop down will appear but i
can't hover over it and navigate through the links.
can someone please help me on this it's driving me nuts.

Thanks in advance,
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] @import vs link for stylesheets

[Chris Ovenden]

On 4/17/07, David Hucklesby <[EMAIL PROTECTED]> wrote:
>
> you may like to consider
> this technique for viewing coding results in several real browsers every
> time you press "save":
>
>   
>
>
Nice idea, David. I use the Edit CSS feature of Firefox's Web Developer
toolbar (http://chrispederick.com/work/webdeveloper/) to see realtime
changes (obviously, only in FF - I don't have enough monitors to take
advantage of your suggestion anyway...), then switch to IE with Microsoft's
DOM Inspector (
http://www.microsoft.com/downloads/details.aspx?familyid=E59C3964-672D-4511-BB3E-2D5E1DB91038&displaylang=en)
to fix the inevitable IE glitches.

-- 
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] lists in blocks

[Alan Gresley]

On April 17, 2007, Robert Lane wrote:

> Gee looks like a table, walks like a table, quacks like a duck! :-)
> Actually I had a similar question but not for menus. I have a document
> that client wants added to web page. They laid it out in a 2 column
> bulleted list format. Of course it has an odd number of bullets, and
> the text per item is all different. So what would be the most stable
> way to handle this. My initial thought was just split the UL into two
> lists and then put in a two column table to hold them. But would it
> work as a div around each of the two ul's and then float them? If I
> did that, do I float one left and one right and set the width's to
> <= 50%  or do I float them both left?

> If the ul div's are contained within a wrapper div, do I position them
relative?   Or is there a better way that is supported by all the usual
browsers?

> Thanks!

Hi Robert

Much easier as separate list and only one div is required that wraps both list. 
I have centered the wrap div. The values given to center it would be less if 
the overall width is not the full window width. If the values are removed from 
the wrap div altogether, then the div floats to the left or right completely 
depending of how the the enclosed ul elements are floated.

http://contueor.com/x/list2blocks.htm

Kind Regards, Alan

__
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] lists in blocks

[Paul Novitski]

At 4/17/2007 02:54 AM, David Sharp wrote:
>David Hucklesby wrote:
> > On Mon, 16 Apr 2007 16:20:40 +0100, Ross Hulford wrote:
> >
> >> I have an unordered list of 10 items
> > [...]
> >> but I want to diaply it in block of 3
> >>
> >> 14710
> >> 258
> >> 369
> >>
> >> Is this possible with css or any other method?
> >>
> >>
> > Did you mean an ORDERED list?
> > Anyway, check out the Wiki:
> > 
> >
> >
> >
>Also the swag - http://www.alistapart.com/articles/multicolumnlists/ -
>or is this out of date now?



I don't think the techniques I described in that 
article are in any way out of date, although I'm 
always hopeful that someone will add to the list 
of solutions.  (I didn't contribute a separate 
link to my article in this thread only because 
the CSS-D wiki already links there.)

If I could rewrite the version of this article 
that appeared in A List Apart I would emphasize 
that in practice I implement the methods that 
entail lots of classes or ids (such as my 
favorite, #6) programmatically using server-side 
scripting; I don't generally hand-code HTML for 
cumbersome markup that's so likely to change, but 
a number of readers were skeptical about these 
techniques because they assumed that they 
required hand-coding.  (They can also be 
implemented by client-side scripting, with the 
usual sacrifice of support when JavaScript is disabled.)

When and if CSS3 becomes supported by more 
browsers we'll be able to take advantage of its own multi-column module:

CSS3 module: Multi-column layout
http://www.w3.org/TR/css3-multicol/

and as discussed here:

Introducing the CSS3 Multi-Column Module
by Cédric Savarese
http://www.alistapart.com/articles/css3multicolumn/

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/

[css-d] right-nav out on IE6

[Brian Cummiskey]

Hi All, I'm working off a 3-col template from the wiki, where content is 
first in the source.  The example was given in 100% fluid.   I've 
altered it some to suit my needs, but for the most part, its the same 
concept. 

My design i'm working with is fixed-width.  I added an outer wrapper 
with the fixed parameters, and that seems to contain it in 'good' 
browsers.  However, in IE6 (FF and Ie7 are ok...  haven't looked at it 
on a mac yet), my right hand nav is popping out all the way towards the 
right, as it would be positioned if the design were 100%.   How can I 
get IE6 to follow into the layout following the rule of the wrapper's width?

Any one have any ideas?

site:
*http://tinyurl.com/2n94pd*

css:
*http://tinyurl.com/2mhwcn


*
__
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] Border on just the text, not the full width of the element

[Jukka K. Korpela]

On Mon, 16 Apr 2007, Lorin Rivers wrote:

> I want to have a border-bottom on an h2 that's centered, but not have
> the border fill the whole width of the containing element.

Assuming that you want a real border-bottom, so that underline won't do, 
then the practical way is to put addition inline markup and apply the 
border to it:

Heading text

with e.g.

h2 { text-align: center; }
h2 span { border-bottom: solid red 2px; }

-- 
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] lists in blocks

[David Sharp]

David Hucklesby wrote:
> On Mon, 16 Apr 2007 16:20:40 +0100, Ross Hulford wrote:
>   
>> I have an unordered list of 10 items
>>
>> 
> [...]
>   
>> but I want to diaply it in block of 3
>>
>> 14710
>> 258
>> 369
>>
>>
>> Is this possible with css or any other method?
>>
>> 
> Did you mean an ORDERED list?
> Anyway, check out the Wiki:
> 
>
>
>   
Also the swag - http://www.alistapart.com/articles/multicolumnlists/ - 
or is this out of date now?

cheers,
D#
__
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] @import vs link for stylesheets

[Erik Visser]

David Hucklesby wrote:
> I didn't mean to be quite so dismissive. But you may like to consider
> this technique for viewing coding results in several real browsers every
> time you press "save":
> 
>   
> 

How wel is this supported accross browser land?
I think i remember that not all browsers support this feature?

There is a very comprehensive browser support chart somewhere. But where 
was it..?

Erik
__
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] yet another CSS menus howto

[Roger Keays]

Hi Alan,

Thanks for the feedback.

 >> Hi all, I've posted a new article on my site explaining CSS menus:
 >> http://www.sunburnt.com.au/publications/design/css_menus I guess this
 >> is pretty archaic stuff really, but I'd be interested if anybody has
 >> some feedback or can spot some bugs. It's been 4 years since I first
 >> wrote about CSS menus, and I think I've got them pixel-perfect now :)
 >> Roger
 >
 > Hi Roger
 >
 > I going to be brutally honest. You have used display:none to hide the
 > unhovered submenus. This is not good for accessibility. Some screen
 > readers will not display those parts of the menu with this value. The
 > display:none also prevents the submenu list items to be tab to in any
 > browser, again not good for accessibility. The value display:none
 > should never be used in list menus or for most coding in general. The
 > are much simpler methods like position:absolute -999em.

Some good points. That's the first time I've ever heard of positioning 
used to hide menus like that. When I have some more time, I'll 
experiment with it further. Exactly what happens when you tab to an 
element at top:-999em?!

 > IE7 is buggy. When the the containing li is hovered after text sizing
 > down, the descending ul preserves the width of the larger text size
 > width until the ul element is hovered. The bug happens in reversed
 > when text resizing up. Sometimes the list items padding reduces when
 > hovered.
 >
 > Most importantly, how does the menu work when there a doctype? You
 > have no doctype, so mordern browsers are rendering the menu in quirks
 > mode.

A poor omission due to my own laziness. I added the doctypes and it 
actually fixed the text resizing bug on IE7. Let me know if you still 
see the problem.

 > There are 30 lines of javascript which does not include the comments.
 > The sons of suckerfish dropdowns have 12 lines and that is all that 
is > needed.

Okay, suckerfish wins :)

 > The javascript should be in conditional comment targeting for IE6 and
 > earlier or a browser that doesn't need the javascript still has to
 > download it.

The js behavior makes reusing these menus that 1% easier for me. I would 
be surprised if any browser other than IE actually downloaded a URL from 
a behavior style, but please correct me if I'm wrong.

 > Soon I will be demonstrating a list menu that builds on to the
 > strengths of the sons of suckerfish menus, and like the suckerfish
 > menus is accessible and with no bugs.

No bugs? I wish there was such a thing in the CSS/browser space ;)

Cheers,

Roger

-- 

Sunburnt Web Services
p: +61 7 3117 9661 (UTC +10)
f: +61 7 3870 8491
w: http://www.sunburnt.com.au
e: [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] IE 6 spacing, clear div

[Gunlaug Sørtun]

Joyce Evans wrote:
> I have 2 issues. First the spacing in my sidebar1 div under the menu 
> (the Flash movies) is way off in IE6 but great in IE7 and Firefox.

At what font-size/-resizing is what spacing "way off" or "great"?
Nothing is very stable in sidebar1 or anywhere else - in any browser.

> The second issue is I don't know how to get the left sidebar 
> (sidebar1) to touch the footer regardless of content amount.

Look for info on "faux columns".

> The URL is http://digiknow.info

There are some serious issues here...

...resulting in an issue here...

...which may, or may not, have an impact on your issues. It certainly
has an impact on design-debugging, so I didn't go further.

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/