Re: [css-d] Personalize predefined colors

[Trebol-a]

> Right -- for an example of a programmatic approach, see our wiki page on
> the subject:
> http://css-discuss.incutio.com/?page=CssConstants
>
> Zoe

thank you very much
__
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] negative margined sidebar moving when window narrowed in IE

[~davidLaakso]

> 
>
>
> How is IE7 doing, btw? (I really dislike "blind hacking".)
>
>
> regards
>   Georg
>   
Doing fine in a 620 window at text-size "largest" xp :: ie/7.0.
~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] negative margined sidebar moving when window narrowed in IE

[Philippe Wittenbergh]

On Feb 15, 2007, at 12:39 PM, Gunlaug Sørtun wrote:

> I have moved leftcolumn into the bottom of contentwrapper, but the
> source-order is otherwise the same and nothing is added or  
> subtracted...
> 
> ...so, maybe it'll do.
>
> How is IE7 doing, btw? (I really dislike "blind hacking".)

I use basically the same technique on a couple of sites. Holds well  
in iExploder 7.

One note though; the wrapper should have position relative as well.  
I've seen the sidebar jumping to the centre in IE when resizing.

For the large image (applies to IE6 on narrow windows) I wrap the  
image in a box:
.img {margin:0 -200px 0 0; position:relative; height:0;}
/* right margin equivalent to size of sidebar */

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] negative margined sidebar moving when window narrowed in IE

[Gunlaug Sørtun]

Zoe M. Gillenwater wrote:

>> http://www.pixelsurge.com/experiment/negative_margins_3-dd.html

>> What I'm interested in, then, is not why it happens but if there is
>>  any way to stop it (short of using overflow: hidden, which 
>> obviously works but kills the needed scrollbars).

One more, with scrollbars intact and no extra wrappers.

I have moved leftcolumn into the bottom of contentwrapper, but the
source-order is otherwise the same and nothing is added or subtracted...

...so, maybe it'll do.

How is IE7 doing, btw? (I really dislike "blind hacking".)

It is possible to turn this into a robust 3 column with the addition of
one more wrapper. That would be more in line with what I'm doing here...

...but I'm using side-borders as basic column-backgrounds, and a lot of
extra wrappers for decoration. Pure overload.
(Got to add Firefox 2.0.0.1 into that Gecko-list :-) )

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] CSS to NOT cache a single image

[david]

Timothy Martens wrote:
> Hi All,
> 
> Wondering if there is someway to have an image NOT cache. I'm using  
> an animated gif as a background image on a link:hover. It works  
> consistently in Firefox, but Safari only plays it on the first  
> instance of hover unless the page is reloaded. Not sure about IE.
> 
> Working example here: http://www.splashdesign.com/dev/css/cssd/

I think that may be a browser setting. I seem to recall Mozilla or 
Firefox or Opera having an option to only play animations once. Perhaps 
Safari has something similar?

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

Re: [css-d] negative margined sidebar moving when window narrowed in IE

[Gunlaug Sørtun]

Zoe M. Gillenwater wrote:
> http://www.pixelsurge.com/experiment/negative_margins_3-dd.html

> What I'm interested in, then, is not why it happens but if there is
> any way to stop it (short of using overflow: hidden, which obviously
> works but kills the needed scrollbars).

Ok. Scrollbars intact, and at least IE6 is playing ball...

...but you know ... those superfluous wrappers :-)

I still can't test in IE7 directly, so I just added what I thought it
needed. The others are doing alright, I think.

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] CSS to NOT cache a single image

[Dan Dorman]

On 2/14/07, Timothy Martens <[EMAIL PROTECTED]> wrote:
> Not sure about IE.

Seems to work in IE as well (version 6, at least).

Dan Dorman
__
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 to NOT cache a single image

[Timothy Martens]

Hi All,

Wondering if there is someway to have an image NOT cache. I'm using  
an animated gif as a background image on a link:hover. It works  
consistently in Firefox, but Safari only plays it on the first  
instance of hover unless the page is reloaded. Not sure about IE.

Working example here: http://www.splashdesign.com/dev/css/cssd/

Aloha,

-tim

__
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] Text & Images not appearing in IE

[Gunlaug Sørtun]

Michael Stevens wrote:
> No, but changing it to Transitional does...

Transitional doesn't have any particular meaning in IE/win - it's 
handled the same as Strict. Valid source-code matters even to IE/win though.

You have lost big chunks of the main column in IE6. If you want it back, 
you may want to add...

@media screen {
* html #content {height: 1%; margin: 0;}
}

...at the bottom of your stylesheet. That will make all lost parts 
visible in IE6 regardless of doctype - and even without one.

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 Problem - Not Showing Left Column

[Gunlaug Sørtun]

Matthew Stoneback wrote:
> All that appears to be missing is an image which completed the 
> "patch" on the upper left side of the page (placed in the left 
> column).

> HTML Page: http://www.eddysound.com/epso/

Designer's coding-errors:
- Wrong names on the IE-fixes.
- Forgotten space between selectors in the '* html' hack.
- Ending last IE-fix with ':' instead of ';'.

Corrected IE hacks...

/*** IE6 Fix ***/
* html #header_left {
left: 324px;
}

/*** IE6 Fix ***/
* html #leftRail {
left: 142px;
}


Also, you should add...

#header_container div img {display: block;}

...to save IE6 from descenders and 'auto-expansion' bugs.



Note that this positioning method is handled extremely messy by IE6 when
browser-window is made narrower.

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] Text & Images not appearing in IE

[Michael Stevens]

No, but changing it to Transitional does...

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of david

Fixing XHTML 1.0 Strict validation errors might be a place to start:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.bctarizona.com%
2Findex_new.php

Don't know if it makes a difference or not ...


__
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] longhand2shorthand software

[Bjoern Hoehrmann]

* Wim H Bezemer wrote:
>Is there an app which re-formats longhand CSS into shorthand CSS?

I do not think there is and this is also a quite difficult excercise if
you do not want to semantically change the style sheet. The longhands
may resolve to different things depending on the CSS level, for example,
'font' would reset font-stretch and font-size-adjust to their initial
values, but most likely you don't specify them, so the tool cannot know
whether you want this side-effect, if it assumes it does and you did
not actually want that, your style sheet gets different semantics, and
if you want it to assume that, but it does do it, then the tool would
not produce the effect you are looking for.
-- 
Björn Höhrmann · mailto:[EMAIL PROTECTED] · http://bjoern.hoehrmann.de
Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de
68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/ 
__
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] negative margined sidebar moving when window narrowed in IE

[Gunlaug Sørtun]

Zoe M. Gillenwater wrote:

> Speaking of being proven wrong ;-), Georg, do you have an index on 
> your site indicating what each of your layout pages is demonstrating?

Have I done something wrong..? :-)

No, I have no index for those demo/test pages. That's my public
playground and I thought each page was self-descriptive enough.

These three...



...present variations on the basics.
Haven't updated them since 2004 though - see dates, so there's now a
weak spot (missing clear) in Opera 9 and a small glitch in the old
IE-expression. Maybe time for an update.

> I'd love to take a closer look at your preferred negative margin 
> layout technique.

Haven't studied in depth, but I think an article in the last ALA is
somewhat close to what I'm doing...

Not close enough for IE6 on narrow windows though, which is why I use
more wrappers :-)

If there's any need for a somewhat robust 2/3 column layout, then I
might write something more complete about mine if/when I can find the
time. For now I have left bits and pieces around in my web design section...


-

Now I'll have a look at your latest...

...and who knows what may come out of _that_ ;-)

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] longhand2shorthand software

[Wim H Bezemer]

Is there an app which re-formats longhand CSS into shorthand 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] Text & Images not appearing in IE

[david]

Michael Stevens wrote:
> www.bctarizona.com/index_new.php
>  
> Fine in FF but two problems in IE:
>  
> 1. The white space of the the "Login" menu on the last  of the left side
> menu.
> 2. Underneath the Presstek ad should be a small graphic with a line
> underneath. The image that is there is correct but there's some text that
> should be to the right of each image as well.
>  
> If it was a positioning problem I might have something to go on but it just
> ain't there in IE so I don't know where to start.

Fixing XHTML 1.0 Strict validation errors might be a place to start:

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.bctarizona.com%2Findex_new.php

Don't know if it makes a difference or not ...

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

[css-d] Text & Images not appearing in IE

[Michael Stevens]

www.bctarizona.com/index_new.php
 
Fine in FF but two problems in IE:
 
1. The white space of the the "Login" menu on the last  of the left side
menu.
2. Underneath the Presstek ad should be a small graphic with a line
underneath. The image that is there is correct but there's some text that
should be to the right of each image as well.
 
If it was a positioning problem I might have something to go on but it just
ain't there in IE so I don't know where to start.
 
Thanks,
 
Mike


__
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] negative margined sidebar moving when window narrowed in IE

[Zoe M. Gillenwater]

I've been playing around with various negative margin layout techniques 
this afternoon, not because I don't like the one I typically use but 
because I like to see what else is out there every once in a while. I 
found a negative margin technique that differed from both my method and 
the famous Ryan Brill method, and it involves giving the sidebar a -100% 
margin in the same direction it's floated. Here are two instances of it:
http://www.dynamicdrive.com/style/layouts/item/css-liquid-layout-21-fixed-fluid/
http://blog.html.it/layoutgala/LayoutGala13.html

However, my test for negative margin layouts is always putting a big 
picture in the fluid column and seeing how the various browsers deal 
with having the browser window sized down to the point that the image 
overflows. Basically, I'm trying to see if IE will drop a column or 
produce a horizontal scrollbar.

Curiously, when I applied the big-image-test to this new negative margin 
technique, it resulted in the left sidebar moving around when the window 
is narrowed in IE, both 7 and 6 (don't care about older versions right 
now). Here's the exact same Dynamic Drive layout, but with a big image 
added and background colors:
http://www.pixelsurge.com/experiment/negative_margins_3-dd.html

I know why IE is doing this: it expands the contentwrapper div instead 
of letting the image overflow. The -100% margin is based on the width of 
contentwrapper, so when contentwrapper is bigger than the window, the 
left sidebar is no longer placed against the left edge of the window. 
You can emulate this in Firefox and other good browsers by giving 
contentwrapper a min-width and decreasing past it.

What I'm interested in, then, is not why it happens but if there is any 
way to stop it (short of using overflow: hidden, which obviously works 
but kills the needed scrollbars). Like I said, I'm just playing around, 
so this is not urgent, but I'm curious. I've tried setting position: 
relative on various divs, giving contentcolumn "layout" (the others 
already have layout), and messing with margins. Haven't come up with 
anything, and I don't think there is a fix, but I'm happy to be proven 
wrong.

Speaking of being proven wrong ;-), Georg, do you have an index on your 
site indicating what each of your layout pages is demonstrating? I'd 
love to take a closer look at your preferred negative margin layout 
technique.

Thanks,
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/

Re: [css-d] Horizontal navigation with background image & inheritance problem (Driving me mad)

[Jeroen]

On 2/14/07, Jeroen <[EMAIL PROTECTED]> wrote:

> I think the problem has to do with inheritance, because as you see on
> the test site,
> it works directly under the body statement, but not in the "cnt" DIV.
> If i however add a
> clearfix before (while in the cnt div) it does work. But then margins
> etc are of course reset which is not what i want either.

I finally found the solution although i don't understand WHY this
fixes it. The fix i used
was to add a clear: both; in the container for the menu.

"The clear property sets the sides of an element where other floating
elements are not allowed." However AFAIK i'm not using any floats at
that point. Can anybody please
explain this?

Thanks!

(working: http://jg2.intellit.nl not working: http://jg2.intellit.nl/dev)

-- 
Jeroen
__
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 Problems with Drop Down Menu

[tedd]

At 4:02 PM + 2/12/07, Sophie Dennis wrote:
>   Hi gang:
>
>  The link:
>
>  http://sperling.com/examples/menuh/
>
>  The problem:
>
>  IE 5-6 required the csshover.htc to make this css technique work.
>
>  In IE7 the menu works w/o the csshover.htc file, but only when the
>  user's cursor is over the text in a menu item and it should be
>  whenever the cursor is over any part of a menu item instead.
>
>
>
>For IE, even 7, it looks like you need a dimension of some sort on the
>LI to get the entire button to behave as a link and not just the text.
>Your IE lte 7 styles have #menuh ul li{float:left; width: 100%;} so I'm
>guessing it's fine in IE6 et al.
>
>For IE7 fortunately min-/max- heights or widths will do the trick just
>as well. So you can just add "min-height: 1px;" (or similar) to your
>#menu LI rule you  get the classic IE random vertical space problem. To
>fix this you'll also need to add "vertical-align: bottom;" to the rule
>to get rid of the extra white space. The full CSS should read:
>
>#menuh LI {
> POSITION: relative;
> MIN-HEIGHT: 1px; /*min-width will work just as well */
> VERTICAL-ALIGN: bottom;
>}
>
>You could add these rules just to an IE7 conditional comment block
>instead, but they do no harm in any other browser AFAIK (I've only
>checked in Firefox) so can go in the main stylesheet just as well.
>
>--
>Sophie Dennis, Creative Director

Sophie:

Works like a charm -- thanks much.

Cheers,

tedd

PS: If you run into a php/mysql problem, drop me a line.
-- 
---
http://sperling.com  http://ancientstones.com  http://earthstones.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] min-width in IE 6 on inline/block element?

[Sophie Dennis]

Magenta Placenta wrote:
> If you save out the following code and view locally, you'll see in 
> Firefox a min-width (red border) on certain  
> bullets.  This is what I'm after.  If you open in IE 6, that min-width 
> is not recognized.
>
> Is there a way to have min-width in IE 6 without resorting to 
> basically doing the horizontal list in divs with specific widths 
> applied?  The min-widths need to be empty/blank/specific width, until 
> they're populated by the user.  Any value that is returned that is 
> longer than the width will be truncated.
IE6 treats "width" as "min-width", so you can just add an IE only rule 
(I've used the star hack) telling it to use width:130px. You'll also 
need to tell it not the wrap the text it you want to keep the boxes 
inline. Like this:

* html ul#excel_legend li.userchoices {
width: 130px;
white-space: nowrap;
}

-- 
Sophie Dennis, Creative Director
Cayenne Web Development Limited
www.cayenne.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/

Re: [css-d] IE horizontal menu problem

[Sophie Dennis]

Hi Tammy,

Tammy Grossbauer wrote:
> I'm having problems with a horizontal rollover menu, but only in IE for 
> Windows. I've
> enclosed links to the homepage, css file and a screen shot of the
> problem. All other browsers read the menu correctly.
> The problem: The buttons are supposed to have a black border around all
> sides. In IE, the border and some extra space on top and bottom are cut
> off. 
> I haven't ran into this problem before. Has anyone 
> else?http://www.carstensdesign.com/home.htmlhttp://www.carstensdesign.com/cdesign.csshttp://www17.brinkster.com/tammath/IE7screen.jpg
>
> Thanks!TG
>
>   
Because it's all inline IE is constraining the anchors to the natural 
height of the LI elements (so hiding the extra padding and border). It 
will behave - and not muck things up in any other browser - if you add 
the IE-only "display: inline-block" to the rule  #navlist A.

-- 
Sophie Dennis, Creative Director
Cayenne Web Development Limited
www.cayenne.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] Z-Index Issues in Table

[Chris Pallé]

Hi Group:

I'm trying to resolve an issue with z-index. I have a UL inside a  
tablecell that I want to hover over and outside of table. The problem  
is, table items from the cells beneath the cell containing the UL  
bleed through the UL when it overlaps.

There is a JS trigger that switches the ul.prodCloseupView display to  
"block." I thought putting a high z-index on the UL would cause it to  
rise above all the other elements, but it didn't help. The h5 on the  
rows beneath bleed through. Am I missing something?

Thanks!

Mark-up (I've taken out a lot for readability):





Product Name


Detail of Shutters Polo Shirt - Ocean - Large

Close Detail















Product Name


Detail of Shutters Polo Shirt - Ocean - Medium

Close Detail













CSS:
#itemTable tr.itemRow ul.prodCloseupView {
display:none;
}

.prodCloseupView {
position:absolute;
top:-200px;
left:0;
background-color: white;
text-align: center;
border: solid 1px #00;
padding: 0 .5em;
z-index:105;
}

.prodCloseupView .closeDetail {
position: absolute;
top:-15px;
right:-1px;
font-size: .9em;
background:white url(../../images/misc/hover-top-tab-right.gif) 100%  
-1px no-repeat;
border-top: solid 1px #00;
z-index:15;
padding: 0px 6px 3px 0px;
}

.prodCloseupView .closeDetail a {
display: block;
background:white url(../../images/misc/hover-top-tab-left.gif) 0  
-12px no-repeat;
padding-left: 6px;
padding-top: 3px;
}

.prodCloseupView h6 {
font-size: 1em;
margin-top: .8em;
text-align: left;
}

.prodCloseupView img.closeUp {
padding: .5em 1em 1em 1em;
}



chris.pallé, interactive media designer

[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 Problem - Not Showing Left Column

[Matthew Stoneback]

Here is the run down on my situation.

 

I used Matthew Levine's article, "In Search of the Holy Grail" from "A List
Apart" to format / set-up my CSS document and HTML test page.

 

The problem: The page looks great in Firefox 1.5, Opera 9.0, Mozilla 1.7,
and Netscape 8.1; but not so hot in one area in IE (multiple versions).  All
that appears to be missing is an image which completed the "patch" on the
upper left side of the page (placed in the left column).  I even tried
placing text in the left column to see what happened; the text showed on all
the browsers in the proper place besides IE.  If anyone has a chance, please
look at the files linked below in multiple browsers and let me know if you
see an error in my coding.  Also, if it is an IE issue, is there a "fix?"

 

HTML Page: http://www.eddysound.com/epso/

 

CSS Document: http://www.eddysound.com/epso/css/epso.css

 

Thanks in advance for any help and guidance.

 

Matthew Stoneback

__
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] min-width in IE 6 on inline/block element?

[Magenta Placenta]

If you save out the following code and view locally, you'll see in Firefox a 
min-width (red border) on certain  bullets.  This is 
what I'm after.  If you open in IE 6, that min-width is not recognized.


Is there a way to have min-width in IE 6 without resorting to basically 
doing the horizontal list in divs with specific widths applied?  The 
min-widths need to be empty/blank/specific width, until they're populated by 
the user.  Any value that is returned that is longer than the width will be 
truncated.



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

http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">












   Legend:
   

   Legend:
   A-Z Community Biz

   Legend:
   1/1/05 - 1/1/06

   Legend:
   My New Temp






_
From predictions to trailers, check out the MSN Entertainment Guide to the 
Academy Awards® 
http://movies.msn.com/movies/oscars2007/?icid=ncoscartagline1


__
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] Divs misaligning in IE only

[Zoe M. Gillenwater]

Anne E. Shroeder wrote:
> http://www.language-works.com/IRF/about/
> CSS: http://www.language-works.com/IRF/css/irfstyles.css
>
> I'm sure this is super simple -- the main body text of my page is shoving 
> down below the left nav bar in IE. 

It's not just IE -- it happens in FF too. It's because you have a div 
between the leftnav and maincontent divs called "nowrap". Get rid of 
this div. Then, get rid of the float on maincontent. Either float both 
the columns and give them both widths but not margins, or float the left 
column only and give the right column no width and a large left margin. 
You're mixing the two methods for creating basic two column float 
layouts, which doesn't work.

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/

Re: [css-d] Personalize predefined colors

[Zoe M. Gillenwater]

Barney Carroll wrote:
> Alberto Garcia Quesada wrote:
>   
>> There are any way of create in my CSS a list of predefined colors, some
>> like:
>> rojo {color:#FF;}
>>
>> from more lated i can used it with:
>>
>> border-color: rojo;
>> 
>
> Alberto,
>
> You cannot define terms in CSS. What you're asking for would be very 
> useful but is outside of the scope of pure CSS - you would need to use 
> an application (www.stylespread.com - very simple and powerful tool to 
> manage CSS) that makes these associations for you, or some kind of 
> clever javascript to parse your CSS code and translate all your colours 
> back into hex numbers.
>   

Right -- for an example of a programmatic approach, see our wiki page on 
the subject:
http://css-discuss.incutio.com/?page=CssConstants

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] IE horizontal menu problem

[Tammy Grossbauer]

I'm having problems with a horizontal rollover menu, but only in IE for 
Windows. I've
enclosed links to the homepage, css file and a screen shot of the
problem. All other browsers read the menu correctly.
The problem: The buttons are supposed to have a black border around all
sides. In IE, the border and some extra space on top and bottom are cut
off. 
I haven't ran into this problem before. Has anyone 
else?http://www.carstensdesign.com/home.htmlhttp://www.carstensdesign.com/cdesign.csshttp://www17.brinkster.com/tammath/IE7screen.jpg

Thanks!TG
_
Personalize your Live.com homepage with the news, weather, and photos you care 
about.
http://www.live.com/getstarted.aspx?icid=T001MSN30A0701
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Site Check ::Jehangir::

[Jehangir Larry]

~davidLaakso wrote:
> Jehangir Larry wrote:
>> ~davidLaakso wrote:
>>> J
> 
>> Grateful for a site check http://www.teerthyatri.com
 
 The footer is the one that is not working for me but thats purely
 subjective.
 
 Regards.
 _j[_
>>> Then one or both of us has made a mistake somewhere along the line.
>>> I think the footer is supposed to be more like this:
>>> 
>>> Best,
>>> ~dL
>> 
> The footer is positioned correctly now and seems to be in order. Would
> you consider making the background-color of it (the footer) the same
> color as your sig image (so it blends in)?
> ~d
Good idea. And implemented - pronto! Thank you.
_j[_
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Site Check ::Jehangir::

[~davidLaakso]

Jehangir Larry wrote:
> ~davidLaakso wrote:
>> J

> Grateful for a site check http://www.teerthyatri.com
>>>
>>> The footer is the one that is not working for me but thats purely
>>> subjective.
>>>
>>> Regards.
>>> _j[_
>> Then one or both of us has made a mistake somewhere along the line.
>> I think the footer is supposed to be more like this:
>> 
>> Best,
>> ~dL
>
The footer is positioned correctly now and seems to be in order. Would 
you consider making the background-color of it (the footer) the same 
color as your sig image (so it blends in)?
~d

-- 
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] Site Check ::Jehangir::

[Jehangir Larry]

~davidLaakso wrote:
> Jehangir Larry wrote:
>> ~davidLaakso wrote:
>>> Jehangir Larry wrote:
 Grateful for a site check http://www.teerthyatri.com
>> 
>> The footer is the one that is not working for me but thats purely
>> subjective.
>> 
>> Regards.
>> _j[_
> Then one or both of us has made a mistake somewhere along the line.
> I think the footer is supposed to be more like this:
> 
> Best,
> ~dL
I did a cut and paste. It works! Great.
This list can and will promote laziness - at this rate.
Regards.
_j[_
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Site Check ::Jehangir::

[~davidLaakso]

Jehangir Larry wrote:
> ~davidLaakso wrote:
>> Jehangir Larry wrote:
>>> Grateful for a site check http://www.teerthyatri.com 
>
> The footer is the one that is not working for me but thats purely 
> subjective.
>
> Regards.
> _j[_
Then one or both of us has made a mistake somewhere along the line.
I think the footer is supposed to be more like this:

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] Site Check ::Jehangir::

[Jehangir Larry]

~davidLaakso wrote:
> Jehangir Larry wrote:
>> Grateful for a site check http://www.teerthyatri.com
>> Problem:
>> FF2 on XP SP2 throws the google search box up towards the header;
>> instead of below the navigation menu in left sidebar, as intended.
>> IE7 shows it fine!
>> Many TIA
>> -
>> _j[_
>> Larry
>>
>>
> The search box is working as intended.
>
> In IE/6.0 you are getting float drop at text-size "largest" (width
> issue?). This at the bottom of the style sheet (on a local file)
> seemed to help: * html .fast #main {width:675px;}
>
> If you are into trivial and esoteric style pursuits, try:
>
> For home page & elsewhere if there is a similar note, try:
> From: html/css
> Just feel free to ask and we promise you, we shall
> deliver.
> Every time.
> .note {width:150px; margin: 20px; float: right; text-align:left;
> color:#801E31; font-size: 85%; border:#f7f6ef thin outset;}
>
> To: html/css
> 
> Just feel free to ask and we promise you, we shall deliver.
> Every time.
> 
> div#note {width:150px; margin: 0 20px 20px 20px; float: right;
> text-align:left;}
> div#note p {background-color: inherit; border: 3px double #cda; color:
> #954a4a; margin: 0; padding: 15px 6px 1.25em 20px; font-size: 85%; }
> div#note p:hover { border: 3px double #c63; }/*for compliant browsers
> and even ie/7.0*/
>
> The footer may be more complex than necessary? See if replacing the
> current styles with these is to your liking:
> #footer {background-color: #E0E0C0; color: inherit; border-top: 3px
> double #a08a5b; clear: both; text-align: center;padding-top: 6px;}
> #footer .nav ul {margin: 0; padding: 2px 0 7px 0; list-style:none;
> text-transform:uppercase;}
> #footer .nav ul.c1 { margin: 0; padding-top: 4px; padding-bottom: 5px;
> list-style:none; font-size: 85%; text-transform:none;}
>
> And you many want to consider bumping up the font-size of h2 (and the
> color) just a little.
>
> Best,
> ~dL

Thanks very much, indeed. I have happily and gratefully adopted ALL your 
suggestions. They are neither trivial nor esoteric. The footer is the one 
that is not working for me but thats purely subjective.
This list rocks because of contributors like you. Hurray.
Regards.
_j[_ 

__
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] Extra horizontal line below footer

[Gunlaug Sørtun]

Marje Cannon wrote:
> Can anyone explain why I am getting the extra white horizontal line 
> below the footer? Occurs in both FF and IE7.

> http://www.fmocompanies.com/working.html

Yes. The image in footer contains a 5px transparent part at the bottom,
and that is included in the #footer height. So, the background is
visible through the transparent bottom of the image.

Alternative 1:
Crop the image - lose the transparent part at the bottom and make it
290px tall, and also make the #footer 290px tall. Then the white
horizontal line will be gone.

Alternative 2:
- Leave the image as is.
- Change footer-styles to...
#footer {
width: 900px;
height: 290px;
overflow: hidden;
}
...and the transparent part of the image will be hidden, and the
horizontal line will be gone.

I can think of a few more alternatives - involving 'negative backside
margins on floats' etc, but the above should do for now.

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] Personalize predefined colors

[Barney Carroll]

Alberto Garcia Quesada wrote:
> Hi all,
> I have looking for by Google and I dont get anything
> 
> There are any way of create in my CSS a list of predefined colors, some
> like:
> rojo {color:#FF;}
> 
> from more lated i can used it with:
> 
> border-color: rojo;
> 
> Yes, color red exists!! is only a example :)
> 
> Regards

Alberto,

You cannot define terms in CSS. What you're asking for would be very 
useful but is outside of the scope of pure CSS - you would need to use 
an application (www.stylespread.com - very simple and powerful tool to 
manage CSS) that makes these associations for you, or some kind of 
clever javascript to parse your CSS code and translate all your colours 
back into hex numbers.

In any case, the real CSS code read by the user would have to read 
#FF [or rgb(255,0,0)].


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

[css-d] Personalize predefined colors

[Alberto Garcia Quesada]

Hi all,
I have looking for by Google and I dont get anything

There are any way of create in my CSS a list of predefined colors, some
like:
rojo {color:#FF;}

from more lated i can used it with:

border-color: rojo;

Yes, color red exists!! is only a example :)

Regards
__
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 drop-down sitemap

[Russ Bombardieri]

Thanks for getting back to me on this.  I agree with you both and perhaps I
should have been a little clearer in phrasing my inquiry.  I am (in no
way/shape/form) after the Open Cube code and would much rather achieve this
using Suckerfish.  I'm just not exactly sure how to achieve the multi-column
layout in a drop down using Suckerfish.  I'm not after any effects at this
point as I can add that tackiness in after if I feel it's necessary.   I am
more after some type of tutorial that walks through the set-up of a
navigation layout such as this.  I am definitely game for taking a crack at
it myself (which I will undoubtedly do anyway), but wanted to see if there
was anything that I could use as a reference first.

Thanks again for your help.


On 2/14/07, Barney Carroll <[EMAIL PROTECTED]> wrote:
>
> OpenCube are very funny people. It seems that their sole purpose is to
> sell this package of theirs... I wrote into them about a month ago
> telling them that their system did not (contrary to their claims)
> operate without javascript /at all/, citing this as a major disadvantage
> when they are trying to sell something that most people would quickly
> develop/rip of their own initiative, and certainly test if they were
> going to buy it. They never did respond!
>
> Comical bunch. I see they've since retracted that claim, and their menu
> system is now slightly uglier, more confusing and pointless (their
> actual site design - navigation excluded - used to be very nice in its
> own right, I think they should've tried selling that instead).
>
> I would definitely recommend Suckerfish over this any day, and then use
> javascript to make the smooth between-states animation (although in my
> opinion this feature is a bit tacky in its lack of necessity).
>
>
> Regards,
> Barney
> __
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> IE7 information -- http://css-discuss.incutio.com/?page=IE7
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
__
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] Fixed Problem with IE6 and CSS dropdown and info request on hover delay behavior

[Arnold Gregory]

My apologies to anyone who spent time on this.
I did not have the latest csshover.htc file.

I am still in search of information about delaying the hover behavior to be
a little more forgiving to users.


Arn


Arnold Gregory
IT Web Services
Embry-Riddle Aeronautical University
386-323-8696

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

Re: [css-d] Site Check ::Jehangir::

[~davidLaakso]

Jehangir Larry wrote:
> Grateful for a site check http://www.teerthyatri.com 
> Problem:
> FF2 on XP SP2 throws the google search box up towards the header; 
> instead of below the navigation menu in left sidebar, as intended.
> IE7 shows it fine!
> Many TIA
> -
> _j[_
> Larry
>
>   
 The search box is working as intended.

In IE/6.0 you are getting float drop at text-size "largest" (width issue?).
This at the bottom of the style sheet (on a local file) seemed to help:
* html .fast #main {width:675px;}  

If you are into trivial and esoteric style pursuits, try:

For home page & elsewhere if there is a similar note, try:
From: html/css
Just feel free to ask and we promise you, we shall 
deliver.
Every time.
.note {width:150px; margin: 20px; float: right; text-align:left; 
color:#801E31; font-size: 85%; border:#f7f6ef thin outset;} 

To: html/css

Just feel free to ask and we promise you, we shall deliver.
Every time.

div#note {width:150px; margin: 0 20px 20px 20px; float: right; 
text-align:left;}
div#note p {background-color: inherit; border: 3px double #cda; color: 
#954a4a; margin: 0; padding: 15px 6px 1.25em 20px; font-size: 85%; }
div#note p:hover { border: 3px double #c63; }/*for compliant browsers 
and even ie/7.0*/

The footer may be more complex than necessary? See if replacing the 
current styles with these is to your liking:
#footer {background-color: #E0E0C0; color: inherit; border-top: 3px 
double #a08a5b; clear: both; text-align: center;padding-top: 6px;}
#footer .nav ul {margin: 0; padding: 2px 0 7px 0; list-style:none; 
text-transform:uppercase;}
#footer .nav ul.c1 { margin: 0; padding-top: 4px; padding-bottom: 5px; 
list-style:none; font-size: 85%; text-transform:none;}

And you many want to consider bumping up the font-size of h2 (and the 
color) just a little.

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/

[css-d] Horizontal navigation with background image & inheritance problem (Driving me mad)

[Jeroen]

Hi there,

I've been trying to incorporate a horizontal menu i found on the
listamatic website.
(customizing it to my own style, not finished yet btw).

Problem is that when i add the code inside my "content" div, the
background image for
the menu fails to display on Firefox/Opera etc. IE works, but let's
not get into that ;)

I've uploaded a test page for those who are willing to take a look.

http://jg2.intellit.nl/dev/

Direct link to CSS:

http://jg2.intellit.nl/css/jg-dev.css

I've made all url's absolute in the CSS so you can easily test it on
your own server/desktop.

I think the problem has to do with inheritance, because as you see on
the test site,
it works directly under the body statement, but not in the "cnt" DIV.
If i however add a
clearfix before (while in the cnt div) it does work. But then margins
etc are of course reset which is not what i want either.

Can someone shed some light on this? It's driving me mad ;) Thanks!

-- 
Jeroen
__
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] Firefox print issue?

[Michael ORourke]

Thanks Georg, that works.


On 2/14/07, Gunlaug Sørtun <[EMAIL PROTECTED]> wrote:
>
> Michael ORourke wrote:
> > http://www.thesalliemaefund.org/smfnew/sections/find.html
> >
> > For some reason the main content area will not print - everything
> > within the div #content-wrapper. However, if I remove the form from
> > the page or set it to display:none the rest of the content prints as
> > expected. The result is the same regardless of whether the print
> > style sheet is used or not. Any ideas?
>
> Gecko can't handle floats properly on print - yet. This is most often
> causing problems with lost parts, when floats are split on page-breaks.
>
> Add this to print-styles...
> form * {float: none!important;}
> ...and Firefox will print it all.
>
> Then restyle the relevant elements in the print stylesheets, so they
> appear alright when printed - even in Firefox.
>
> 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] Firefox print issue?

[Gunlaug Sørtun]

Michael ORourke wrote:
> http://www.thesalliemaefund.org/smfnew/sections/find.html
> 
> For some reason the main content area will not print - everything
> within the div #content-wrapper. However, if I remove the form from
> the page or set it to display:none the rest of the content prints as
> expected. The result is the same regardless of whether the print
> style sheet is used or not. Any ideas?

Gecko can't handle floats properly on print - yet. This is most often
causing problems with lost parts, when floats are split on page-breaks.

Add this to print-styles...
form * {float: none!important;}
...and Firefox will print it all.

Then restyle the relevant elements in the print stylesheets, so they
appear alright when printed - even in Firefox.

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] Firefox print issue?

[Michael ORourke]

Hello all,
I've encountered an odd problem when trying to print the following page from
Firefox:
http://www.thesalliemaefund.org/smfnew/sections/find.html

For some reason the main content area will not print - everything within the
div #content-wrapper. However, if I remove the form from the page or set it
to display:none the rest of the content prints as expected. The result is
the same regardless of whether the print style sheet is used or not. Any
ideas?

Thanks!
Michael
__
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] Why isn't the left column pushed down??

[Jan Erik Moström]

Reply to Gunlaug Sørtun <[EMAIL PROTECTED]> 07-02-14 12:56:

>There are a few more potential traps when it comes to 'collapsing
>margins', as IE does not understand and react the same as other browsers
>on all standard properties we can use to "fix" the problems, and IE also
>has a few variants of its own that are not written in any standard but
>Microsoft's. See: 'hasLayout'[3].
>
>
>Who said "learning CSS isn't fun" ;-)


:-)

Is it enough if I say "interesting" :-D

Thanks

 jem
__
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] Extra horizontal line below footer

[Marje Cannon]

Can anyone explain why I am getting the extra white horizontal line below
the footer? Occurs in both FF and IE7.

 

http://www.fmocompanies.com/working.html

 

http://www.fmocompanies.com/styles-fmo.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] css drop-down sitemap

[Barney Carroll]

OpenCube are very funny people. It seems that their sole purpose is to 
sell this package of theirs... I wrote into them about a month ago 
telling them that their system did not (contrary to their claims) 
operate without javascript /at all/, citing this as a major disadvantage 
when they are trying to sell something that most people would quickly 
develop/rip of their own initiative, and certainly test if they were 
going to buy it. They never did respond!

Comical bunch. I see they've since retracted that claim, and their menu 
system is now slightly uglier, more confusing and pointless (their 
actual site design - navigation excluded - used to be very nice in its 
own right, I think they should've tried selling that instead).

I would definitely recommend Suckerfish over this any day, and then use 
javascript to make the smooth between-states animation (although in my 
opinion this feature is a bit tacky in its lack of necessity).


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

Re: [css-d] css drop-down sitemap

[Sophie Dennis]

Russ Bombardieri wrote:
> Can someone point me in the direction of a resources that breaks down a
> navigation system similar to the "site map" link found on the Open Cube web
> site (http://www.opencube.com/).  I have a need to develop a navigation
> system that displays data in that type of view.  I know it can be done using
> CSS (an possibly a little unobtrusive JS)... but I am at a loss as to what
> terms to even search on.  Any help would be greatly appreciated.
>
>   
Thought I'd respond as no-one else had. If you check the source for the 
Open Cube page you'll see references to "Ultimate Menus". If you look at 
the Open Cube page itself, you'll see they are in fact plugging their 
"Infinite Menus" CSS/JS code on that very page. I'm just guessing this 
is what they're using for their own menus ;-)

Personally I'm not sure I like the look of the source code its 
generated. I can see no reason you couldn't achieve the same affect 
(minus some of the dancing balony) with Suckerfish. See 
http://www.htmldog.com/articles/suckerfish/dropdowns/

-- 
Sophie Dennis, Creative Director
Cayenne Web Development Limited
www.cayenne.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/

Re: [css-d] Why isn't the left column pushed down??

[Gunlaug Sørtun]

Jan Erik Moström wrote:
> 

> My problem is the "blue" area, the left column. When I increase the 
> padding of the horizontal navbar the content area is pushed down but 
> not the left column and I don't understand why. Can anyone tell me 
> why this happen?

Because W3C standards says so - seriously.

If you increase the padding bottom sufficiently - say: 100px, then both
#leftcolumn and #pagecontent are pushed down exactly the same amount.
However, depending on which browser you're using, it may not look like
the same amount. Some "nasty" 'collapsing margins'[1] and different
margin-defaults across browser-land, messes it up a bit.


What happens:

- #leftcolumn is a float, and floats contain 'collapsing margins'[1].
Thus, it moves down an exact amount of pixels equal to the
padding-bottom on #pagebar.

- #pagecontent in *not* a float or self-contained box[2], so the top
paragraph-margin is escaping it and pushes against the padding you've
added on #pagebar.
Vertical paddings have this effect on 'collapsing margins'[1] - making
#pagecontent move down an exact amount of pixels equal to the
padding-bottom on #pagebar + the amount of margin-top it has on the
first paragraph inside #pagecontent.

This paragraph-margin creates a gap _above_ the #pagecontent instead of
above the first paragraph inside #pagecontent - that's why it's called
'collapsing margin'[1].
This gap have different size in IE, Firefox, Opera etc, because they
have different margin-defaults on paragraphs. If you declare equal
margins on paragraphs (and other elements), then they will line up
identically.

In short: what a standard-compliant mess :-)


Solution: prevent those margins from escaping their containers -
collapsing - on all containers.

1: start by adding...

#pagecontent {padding: 1px 0;}

...to prevent paragraph-margins from escaping #pagecontent in all
browsers. This is just one way to achieve this effect, and the others
are described in the W3C sections linked to at the bottom of this mail.

2: add whatever padding-bottom size you want to #pagebar, and both
#leftcolumn and #pagecontent will move down perfectly in line with each
other.

---

There are a few more potential traps when it comes to 'collapsing
margins', as IE does not understand and react the same as other browsers
on all standard properties we can use to "fix" the problems, and IE also
has a few variants of its own that are not written in any standard but
Microsoft's. See: 'hasLayout'[3].


Who said "learning CSS isn't fun" ;-)

regards
Georg


[1]http://www.w3.org/TR/CSS21/box.html#collapsing-margins
[2]http://www.w3.org/TR/CSS21/visuren.html#q15
[3]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] Site Check ::Jehangir::

[Jehangir Larry]

Ingo Chao wrote:
> Jehangir Larry wrote:
>> Grateful for a site check http://www.teerthyatri.com
>> Problem:
>> FF2 on XP SP2 throws the google search box up towards the header;
>> instead of below the navigation menu in left sidebar, as intended.
>> IE7 shows it fine!
> 
> The styles were not loaded at all because of a server
> misconfiguration, the css file was sent as text/html instead of
> text/css. 
> 
> For the search box problem: the form should clear the float.
> 
> Ingo
Thanks, Ingo. While cleaning up the CSS file I erased a rule set.
Why did this omission not affect IE at all?
Also, appreciate a cross browser check.
Regards.
_j[_
__
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] Why isn't the left column pushed down??

[Jan Erik Moström]

I'm trying to create a template and there is (at least) one 
thing that I don't understand.

An example of the template can be found at 


My problem is the "blue" area, the left column. When I increase 
the padding of the horizontal navbar the content area is pushed 
down but not the left column and I don't understand why. Can 
anyone tell me why this happen?

The relevant (I think) parts of the CSS and HTML files look like this
-
#pagebar
{
 padding: 3px 5px 10px 5px;
 width: 100%;
}

#pagebar ul
{
 background-color: red;
 display: inline;
 list-style: none;
 float: left;
 margin: 0px;
 padding: 0px;
}

#pagebar li
{
 border-right: 2px solid #fff;
 display: inline;
 padding: 0px;
 margin: 0px;
}

#leftcolumn
{
 background-color: #3FF;
 width: 150px;
 float: left;
 margin: 0px;
 padding: 0px;
}
--

 
 ...
 
 
 One
 Two
 

 
 
 
 Lorem ipsum dolor
 
 One
 Two
 

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

Re: [css-d] Site Check ::Jehangir::

[Ingo Chao]

Jehangir Larry wrote:
> Grateful for a site check http://www.teerthyatri.com 
> Problem:
> FF2 on XP SP2 throws the google search box up towards the header; 
> instead of below the navigation menu in left sidebar, as intended.
> IE7 shows it fine!

The styles were not loaded at all because of a server misconfiguration, 
the css file was sent as text/html instead of text/css.

For the search box problem: the form should clear the float.

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] Site Check ::Jehangir::

[Robin Fisher]

Hi,

All looks fine on IE6/Win.  Nice site!

Kind Regards

Robin

On 2/14/07, Jehangir Larry <[EMAIL PROTECTED]> wrote:
> Parag Jagdale wrote:
> > I dont think your css is linked right - the styles are not applied at
> > all.
> >
> > Parag
> No stylesheet is fine...please recheck?
> Thanks
> _j[_
> __
> 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/