Re: [css-d] RFC: printing backgrounds by default

[Robert Van Dam]

You raise a good point about cascading for more involved background
uses.  Then I suppose my next question is, how much do you think
people have _relied_ on the knowledge that gecko based browsers would
not print their backgrounds in order to avoid the effort of adding a
print stylesheet just to remove them (essentially doing what you've
already done for them) versus how much people unknowingly run into the
problem or alternatively never even realize that there is an issue?

I for one would imagine that a large majority are completely oblivious
to the fact that backgrounds don't get printed because any backgrounds
that they might have are not essential to the site (especially if you
do modify light colored text to read better).  I would then venture to
guess that those same people have not nor will they ever bother
creating a print stylesheet.  That only leaves one possible problem
which may be what your reviewer was getting at and that is, how many
CMS's and WYSIWYG editors include an empty print stylesheet if you
don't specify any print styles?  I don't know the answer but the more
I think about it the more likely it seems that some would do that.

Or can you have a special exception for stylesheets that don't contain
any valid rules?

Rob

On 8/9/07, fantasai <[EMAIL PROTECTED]> wrote:
> Robert Van Dam wrote:
> >
> > I don't see anything confusing in it*.  I suppose it might catch a few
> > developers off guard at first but going forward, I would imagine the
> > existing method is far more confusing to anyone unfamiliar with this
> > problem.  What's more confusing, "I said show a background for printed
> > versions of the page and so you printed it" or "I said show a
> > background for printed versions of the page and so you ignored me"?
> >
> > * caveat: After rereading what you wrote I realized that I
> > misinterpreted your plan.  My above comment would apply if and only if
> > the background was specified in the print style sheet.  That would
> > seem to indicate to me that a developer knows what they want (as in
> > your opera example).  Printing a background specified elsewhere just
> > because there is a print style sheet could easily catch a lot more
> > developers off guard and be more confusing (though probably still less
> > surprising/confusing than failing silently).
> >
> > Would it be reasonable to be that specific about when to print or not
> > to print a background?
>
> Well, 1. it would be a lot more difficult to implement, but 2. I think
> authors should be able to rely on the cascade working properly. For example,
> a page might have a light-colored background, and use backgrounds for
> accents e.g. on headings or table headers. I want to get rid of the
> overall light-colored background in favor of black on white, but I want
> all the accents to show up, too. If the cascade is working normally, all
> I need to do is specify a print stylesheet with
>body { background: white; color: black; }
>
> If the browser is being selective and only honoring backgrounds inside
> print-specific style sheets, then I'd need to duplicate all of my background
> and color settings in the print style sheet.
>
> Depending on how the CSS was authored, the combination of rules in the
> non-print-specific and print-specific sheets could result in a rather
> broken design if all the non-print-specific rules were suddenly ignored.
>
> When we disable all backgrounds, we know the background is always white
> and we can compensate by darkening the text colors if they are too light.
>
> ~fantasai
>
>
__
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] Problems with Firefox and horizontal menu

[Robert Van Dam]

On 8/3/07, Terri Houston <[EMAIL PROTECTED]> wrote:
> Sucker Tree Horizontal Menu
> www.ttcollectiblegifts.com/dynamicdrive.html
>
> I'm satisfied with the way my menu looks in IE browser, but not in Firefox.  
> As I hover on a top level list item, the background shortens, making the next 
> top list item overlap the top of the top link.  Any ideas on why this is 
> happening?

The problem is that the designer of your menu didn't take into account
the possibility of the vertical padding of the  tag at the top
level overflowing the bounds of the containing ul/li.  IE gladly
expands container elements to wrap around floating elements, even when
it's not supposed (as in this case).

You can fix this by changing the rule on .suckertreemenu ul li a to
include "display: block;"

>
> Also, in Firefox, my menu is not nearly as wide as it looks in IE.  How can I 
> change this?
>

The above fix should significantly widen your menu.  You will probably
need to play with the width: 100px or else the top menu boxes are
likely to wrap in any small display.  Also, be aware that once you
have display: block, having both width and left/right padding is
inconsistent (not to mention redundant with text-align: center) and
going to get you inconsistent results across browsers, either remove
the fixed width (so that each menu with expand to fit its text) or
change the padding to padding: 5px 0px

But you also have a very strange rule:

ul..suckertreemenu {
width: 820em;
margin: auto;
}
-->

replace that with something like

.suckertreemenu {
width: 820px;
margin: 0px auto;
}

note the px instead of em, if any browsers even managed to parse that
selector, it would have made your menu 820 times as wide as an M in
your browser's font.  That can't be what you want. Then again, you do
have it set to be 5300 pixels high, so what's 8200+ pixels wide!
(820px won't work either because the parent elements force it to 808px
(at least in firefox) which is too small to handle the 816px that it
wants to be with 1px borders around 100px boxes, it does work on its
own though).

> I would love to be able to center the menu on my webpages, and not have to 
> worry about placing it. Can I do this?

The margin: 0px auto; will give you 0px of vertical margin and
horizontally center the entire div.  Although, you'll need to consider
the conflicts that such loose positioning will have with all the very
strict relative positioning you have on the other elements of the page
(as with my note on width above).

Rob
__
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] Mixing fluid layouts and px padding

[Richard Brown]

Hi

I have just completed the re-design of this site:



I was at first using a fixed width design but wanted to regain a fluid
width design. However, I ran into the problem of using widths = % but
padding in px. It was breaking the design in that the columns were not
sitting side by side. How do other folks get around this please? Is
there a better method of padding elements than px when doing a fluid
design.

Many thanks.
-- 
Kind regards
Rich
http://www.cregy.co.uk
Embracing what God does for you is the best thing you can do for him.
Romans 12 v 1
__
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] IE6 will not drop down a list.... please help

[Holly Bergevin]

>-Original Message-
>From: Holly Bergevin 

>>From: "Roelf D. Kuitse" <[EMAIL PROTECTED]>

>> IE6 will not drop the list down when you hover over it.  Any Ideas???

>>www.autodata.com/test/test

>Well, I could not find the csshover.htc file, (which may be what you are
>using to control the dropdowns in IE6) so perhaps the browser is having
>the same difficulty. Check the path to the file and make sure that it's
>really there.

From: "Roelf D. Kuitse" <[EMAIL PROTECTED]>

>I actually don't have a csshover.htc file.. I run the hovers and the
>drop downs with a file called menuh.css

Exactly. As I said, I couldn't find the .htc file. But to make IE6 obey :hover 
on an element other than an anchor, which you do have a number of instances in 
your menuh.css [1], you will need the csshover.htc file that is called for in 
your HTML document. See the conditional comment in the head of your document 
for the following (snipped other parts of the CC) - 

body{behavior:url(/css/csshover.htc);

If you don't want to use the .htc file, you will need to find another way to 
get those menus to display in IE6.

~holly

[1] from your menuh.css style sheet - 

/* Begin non-anchor hover selectors */

/* Enter the more specific element (div) selector
on non-anchor hovers for IE5.x to comply with the
older version of csshover.htc - V1.21.041022. It
improves IE's performance speed to use the older
file and this method */

div#menu h2:hover{
background: #ff no-repeat -999px -px;
}

div#menu li:hover{
cursor:pointer;
z-index:100;
}

div#menu li:hover ul ul,
div#menu li li:hover ul ul,
div#menu li li li:hover ul ul,
div#menu li li li li:hover ul ul
{display:none;}

div#menu li:hover ul,
div#menu li li:hover ul,
div#menu li li li:hover ul,
div#menu li li li li:hover ul
{display:block;} 
 
   
__
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] RFC: printing backgrounds by default

[Robert Van Dam]

On 8/4/07, fantasai <[EMAIL PROTECTED]> wrote:
> Hello!
> I'm a Mozilla developer, and I have a slightly off-topic question for the
> members of css-discuss.
>
> As I'm sure many of you have noticed, browsers don't print backgrounds by
> default. As David Dorward notes [1], this is in large part to avoid wasting
> ink printing pages that weren't designed to be printed.
>
> We'd like to make it possible for designers who /do/ take the time to
> consider printing to use backgrounds and have them printed by default.
>
> My suggestion was to automatically allow background printing for any
> pages that import an explicit 'print' style sheet, the logic being that
> if you've taken the trouble to provide a dedicated style sheet for
> print, then we should trust that you are not going to abuse the printer
> and allow you use of its ink for your backgrounds. (This is similar to
> how Opera employs lots of heuristics to tweak layouts for display on
> cell phones, but gives the designer full control if he or she has
> specified a style sheet explicitly for 'handheld'.)
>
> My superreviewer David Baron is concerned that this kind of switch would
> be confusing to web authors. E.g. importing an empty print style sheet
> would suddenly cause all backgrounds to print.
>
> So we want to know what you think: would a switch like this be confusing?
> Is there a better way to handle this kind of switch? What are your thoughts
> on this problem?
>
> For those who want more details, the bug report is here:
>https://bugzilla.mozilla.org/show_bug.cgi?id=381466
>
> ~fantasai
>

I don't see anything confusing in it*.  I suppose it might catch a few
developers off guard at first but going forward, I would imagine the
existing method is far more confusing to anyone unfamiliar with this
problem.  What's more confusing, "I said show a background for printed
versions of the page and so you printed it" or "I said show a
background for printed versions of the page and so you ignored me"?

* caveat: After rereading what you wrote I realized that I
misinterpreted your plan.  My above comment would apply if and only if
the background was specified in the print style sheet.  That would
seem to indicate to me that a developer knows what they want (as in
your opera example).  Printing a background specified elsewhere just
because there is a print style sheet could easily catch a lot more
developers off guard and be more confusing (though probably still less
surprising/confusing than failing silently).

Would it be reasonable to be that specific about when to print or not
to print a background?

Rob
__
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] Table cell border color in Firefox

[Robert Van Dam]

Definitely a firefox border-collapse bug.

Without knowing what your actual page looks like, your test page looks
fine with border-collapse: separate; and cell-spacing: 0px;  Just be
aware that IE doesn't pay attention to cell-spacing, so you could use
any number of standard hacks to pass border-collapse: collapse; to IE
only, but then any browsers that just worked on the original would be
getting the lesser version.

I don't know of any good hacks for passing something only to firefox
but you might be able to find one.  It also looks fine in konqueror
(which means it probably looks fine in safari) if that matters.

Oh, and do like fantasai said and change the style for th.hi to
th.lo:hover and remove all those onmouseover/outs.

Rob

On 8/6/07, fantasai <[EMAIL PROTECTED]> wrote:
> James Eaton wrote:
> > My apologies ahead of time if this is a JavaScript problem rather than
> > CSS.  It appears to me to be CSS, but...
> >
> > http://zolx.com/test/test.html
> >
> > This works correctly in IE6, but not in Firefox 2.0.0.6.  The issue is
> > that when mousing over the header row in Firefox, the effect only works
> > correctly in column one.  In all columns, both the background color and
> > the bottom border color should change, but only the background is
> > changing.
>
> Looks to me like a bug in Firefox. (Our border-collapse handling is a mess.)
> Opera handles it correctly.
>
> BTW, you might want to consider using :hover instead of JavaScript.
>
> Anyway, I added your testcase to
>https://bugzilla.mozilla.org/show_bug.cgi?id=286797
> hope you don't mind. :)
>
> ~fantasai
> __
> 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] indenting text not in a tag.

[Robert Van Dam]

On 8/8/07, Ross Hulford <[EMAIL PROTECTED]> wrote:
> I have a news page like this
>
>
> 
>
>
> Archive News 1
>
> item 1
>
> This is ny news item
>
> Archive News 2
>
> Item 2
>
> This is another news item
>
>
> Archive News 3
>
> Item 3
>
> This is another news item
>
>
> 
>
> This goes on forever. I need to indent all the text but when I use
>
> #container {
> text-indent :30px;
>
> }
>
> the two spans indent but the ordinary text does not indent. Is there a way 
> other than wrapping in  tags to get them to indent. This page is very long 
> so adding  tags would take ages.
>

Would something as simple as this work?

#container {
text-indent: 30px;
}

#container span {
text-indent: 0px;
}
__
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] Looks fine on my IE6 but not others

[Hakan K]

Looks great on FF, IE7 ..
Ask that "another person" to get you a screen shot next time..





Thanks
Hakan
http://dominor.com


On 8/8/07, Robert Van Dam <[EMAIL PROTECTED]> wrote:
>
> On 8/8/07, Tim Offenstein <[EMAIL PROTECTED]> wrote:
> > I'm hoping someone can detect and substantiate this issue for me
> > because I'm flying blind. The site is http://www.rst.uiuc.edu. It
> > validates fine and looks fine in IE6 on my desktop but another person
> > on campus says when they look at the site (also in IE6), the main
> > content is pushed down until it clears the left-hand menu.
> >
> > Relevant CSS is http://www.rst.uiuc.edu/css/fonts.css and base.css.
> >
> > Any help is greatly appreciated.
> >
>
> Looks fine in FF linux, even at 800x600.
> __
> 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] Photo grid with captions in CSS. Any ideas?

[Robert Van Dam]

Just play around a little bit with the image sizes that you have.
This worked for me using images of size 340x250.

dl {float:left;text-align:center;}
dt,dd {width:35em;float:left;}
dt {margin-bottom:4em;}/* vertical space between the images */
dd {margin:250px 0 0 -35em;}
img {vertical-align:bottom;border:0;}
em { display: block; font-weight: bold; margin-bottom: 5px; }

Note
 - the margin on dd should be the height of your images (if they're of
different sizes, the maximum height among all of them).
 - the width on dt,dd and the negative margin dd should be large
enough to be bigger than the widest of your images.

Unfortunately, because you're images are so much larger than the
original example, if you use ems (as I've done above) and then
increase the font size, the dds will get so large, they'll be off the
page to the right.  So in your case, you might consider using a pixel
size, say 365px and then just live with the fact that it isn't quite
as scalable anymore.  In this case, that's really not that big a deal
because most resolutions won't fit more than 3 365px images (with
spacing) side by side anyway.

Rob



On 8/8/07, Malcolm N <[EMAIL PROTECTED]> wrote:
> On Wed, 08 Aug 2007 13:43:56 -0400,  E Michael Brandt
> <[EMAIL PROTECTED]> wrote:
>
> >I will tinker with it later when I get a chance, but really don't  you
> >think 340 by 250 is humungous for a thumbnail? Perhaps you are not
> >really looking for thumbnail page styling?
> >
> >--
> >
>
> Yes - humungus is the word. ;-)
>
> No - I was rather looking for better way to display a small photo
> album - say a page with 10 images about that size and not use
> thumbnails.
>
> Up until now I have been giving each photo a div - floated left
>
>
>   height="xxx"  border="0" />
> xxx
> 
>
> keeping to keep the text photo legend within the same width as the
> photo I have had to use a selection of css rules or determine the size
> with php - but as I say this must be inefficient / bloated etc.
>
> I thought your idea rather better -
>
>
>
> __
> 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] Looks fine on my IE6 but not others

[Robert Van Dam]

On 8/8/07, Tim Offenstein <[EMAIL PROTECTED]> wrote:
> I'm hoping someone can detect and substantiate this issue for me
> because I'm flying blind. The site is http://www.rst.uiuc.edu. It
> validates fine and looks fine in IE6 on my desktop but another person
> on campus says when they look at the site (also in IE6), the main
> content is pushed down until it clears the left-hand menu.
>
> Relevant CSS is http://www.rst.uiuc.edu/css/fonts.css and base.css.
>
> Any help is greatly appreciated.
>

Looks fine in FF linux, even at 800x600.
__
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 replacement techniques and CSS

[Gunlaug Sørtun]

Michael Leibson wrote:

>>> I've a question about image replacement techniques and CSS.  For
>>> details, please see: 
>>> http://members.distributel.net/~leibson/Gilder-Levin.htm

> From the many well-written (and well-presented) web-sites on the
> subject, I'd gotten the impression that image replacement is fairly
> commonly used, and expected that it would be well-known among the
> number of really good web designers using this list.


Your test with paddings fails on two points:
1: padding is added to dimensions.
2: at least two actual _positions_ must be used for a 'position: 
absolute' positioned element to "land" where it's supposed to under 
those conditions.

So, you image is too small, and the span ends up in being positioned by 
the padding on the h3, instead of overlapping it as it should.

I've corrected these issues here...

...and you can clearly see that both dimensions and positions are 
different from your original, with padding in place.

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] Z-index problem in Internet Explorer

[Gunlaug Sørtun]

Francois Jordaan wrote:

> http://www.fjordaan.net/tests/z-index.html
> 
> It seems that position: relative puts an element higher than any absolutely
> positioned elements earlier in the DOM tree.

 > Is there a solution for this problem in IE?

Sure. Layer the relative positioned _container_ for the element that 
should stay on top, one level higher.

Add...
z-index: 1;
...to Div B, which will also lift its child: Div Z.

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] IE7 Drop Shadow Issue

[Jade True]

Hello!

I'm hoping someone has a clue for me. I'm using a drop shadow
technique that is found here:
http://aranea.zuavra.net/index.php/52/

I wanted an all 4 sides drop shadow that would expand/contract on a
fluid site.

In IE7, the SE and SW corners stick out some from the bottom, and I
can't figure out why! Any ideas?
Here's the site where the drop shadows are being utilized:

http://www.cherryzen.jadetrue.com/

Thanks!
Jade True
www.sagefish.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] Tables problem in a two columns layout.

[Gunlaug Sørtun]

Ahmed Essam wrote:
> I'm making a two columns layout for my website...
> I face a problem in internet explorer when I used tables in the contents 
> column (the right one)
> As the left column is floating to the left, the tables clears the right side 
> of that column, although all other
> contents sucha s text or images are place correctly..
> What can i do?
> 
> http://www.ahm531.com/archfoundation.html

IE can't handle overflow properly - especially in 'quirks mode', and the 
elements with margins are too wide with the given styles.

Change the styles on the div around those tables, so they read...



...and it will work.

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 background position bug demo

[Snadden Tim]

> > http://snadden.com/demo/ie-background.htm

> Did you try to set font-size on html instead of body?

Good point. Setting the font size on html does work. 

However, one limitation is that  in IE7 blowing up the page with CTRL-+
increases the font size but doesn't move the background across
proportionally. If you but the background on a wrapper div it changes
position in proportion to the font size as it gets blown up or down.
This is what you need if you are going for that faux column effect. 

It looks like somehow the background image position is being calculated
before the font size. 
This email with any attachments is confidential and may be subject to legal 
privilege.  
If it is not intended for you please reply immediately, destroy it and do not 
copy, disclose or use it in any way. 
__
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 Major blow out in IE6 and 7

[Gunlaug Sørtun]

Terri Chicko wrote:
> Hi Friends I'm ready to pull my hair out. My new site works great in 
> FF and mac programs, but it's really on the fritz with IE 7 and 6

> www.hotniniz.com

Before you start pulling your hair out, I'd advise a revision of the
source-code. It's too messy at the moment to bother to debug for
cross-browser reliable rendering...


The stylesheet is also in need of some clean-up it seems...


> It is mostly the table that is giving me headaches. I need to use a 
> table in this site. So... any help would be appreciated.

I don't know whether you need to use a table, or not, for that line-up,
but once you have fixed the source-code and CSS a bit, you can worry
about how to use clear on the table without clearing the sidebar and
having to compensate for that.
It's a case for 'hasLayout'[1] triggers and 'block formatting'[2].

Simplified styling is even more important, as many of the
properties/values, and elements, you have used serve no purpose other
than to complicate things without making much of an impression on any
browser.

It may turn out somewhat like this...

...once you have finished the clean-up.
The test-case I've provided is what I got when I let my Tidy (with my 
own settings) have a go at it, and Tidy just cleaned out enough to make 
it work and become somewhat valid, and changed the doctype to reflect 
what was left. That's not enough.

> Also, doesn't IE 6 see PNGs?

Not without its proprietary filters.
(I didn't bother with those for a test-case like this, so pardon my 
substitutes.)

regards
Georg

[1]http://www.satzansatz.de/cssd/onhavinglayout.html
[2]http://www.w3.org/TR/CSS21/visuren.html#block-formatting
-- 
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] problem with opera and moved div

[Gunlaug Sørtun]

Tomasz Tybusz wrote:
> I made a theme for php-nuke based on css and divs. This is sample 
> page http://www.nsst.pl/wakacje/modules.php?name=ZClassifieds I have 
> problem with Opera Browser. Other browsers like IE or Firefox display
>  this page correctly. In Opera div named tres is moved on the left. 
> CSS for this site: 
> http://www.nsst.pl/wakacje/themes/wakacjev1/style/style.css

> What is wrong?

Your CSS doesn't make sense, so browsers are guessing. We call it
"error-recovery" and it isn't standardized across browser-land.

Correct the relevant styles to...

.tresc {
font-family : Tahoma, Verdana, arial, Helvetica, sans-serif;
font-size : 10px;
font-weight : normal;
color : #588fc7;
z-index : 4;
background-color : #ff;
width : 395px;
padding : 0 15px 0 5px;
margin : 0 0 0 2px;
overflow : auto;
position : absolute;
left: auto;
top: 150px;
right: 6px;
bottom: 10px;
height: auto;
}

...and add...

* html .tresc {
height: 100%;
}

#main {
position: relative;
}

This will establish a relationship between the #main container and the
.tresc container, and use proper positioning for the latter to solve the
height-issue in the good browsers. IE6 gets the '* html' hacked
workaround since it doesn't understand 4-edge positioning.

The doctype you use triggers old 'quirks mode'. Although the differences
between 'quirks mode' and 'standard mode' rendering are few for your
page, I'll advise you to use a 'standard mode' triggering doctype.

http://www.w3.org/TR/html4/loose.dtd";>

...will work just fine.

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] loading order of divs?

[Rob Stevenson]

Hello,

I'm working with a shopping cart program which assembles pages from a  
number of PHP files and applies styles to them. In most browsers,  
what will become the left column of the page loads just after the  
header area -- but it's in the middle of the window. Then when the  
middle content area is loaded the left column relocates to where it's  
supposed to be, on the left.

I asked about this on the program's support forum and someone replied  
that they used to know a simple CSS fix for this but couldn't recall  
it. Does someone here know what to do? I don't mind different parts  
of the page appearing sequentially -- most people have fast enough  
connections that that is not a problem. But I would prefer the left  
column to become visible where it's going to stay.

You can see the effect here if you wish...


Click the Artists category, then one of the artists names. You can  
return to the home page and do it again usiing the same category and  
artist, and the same thing will happen, so it's not a browser cache  
issue.

The effect can be seen in FF, Opera and Safari -- on both Mac OS X  
and Win XP. In IE, the effect is slightly different. The header loads  
and the border of the eventual content draws wrapped around the  
header. Then when the left column and the center content are loaded,  
the border bottom moves down where it's supposed to be.

In short, I'd like things to draw as if their sizes and locations  
have been pre-calculated. Can this be assured using CSS?

Rob
__
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 background position bug demo

[Ingo Chao]

Snadden Tim wrote:
> Recently I needed to set a background image on  in order to create
> full height faux columns. I found that if font size is set on 
> that IE still uses the default font size to position the background
> image. To get around it I ended up putting the background image on a div
> instead. 
> 
> Here is a demo:
> http://snadden.com/demo/ie-background.htm
...

Did you try to set font-size on html instead of body?

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] CSS validation warnings question

[Richard Grevers]

On 8/8/07, Brian Cummiskey <[EMAIL PROTECTED]> wrote:
> Terri Chicko wrote:
> > It says my CSS validates but I have 22 warnings all similar. Sorry, I
> > know these are dumb... but I don't understand.
> >
> > Warning
> > "Same colors for color and background-color in two contexts #headline
> > and h1"
> > Thanks
> > Terri
> >
> This means you have a background color that equals the foreground color,
> ie White on White.
>
> It gives you a warning, as technically, this text is not visible.

I'll just add that the validator has no knowledge that you have no
intention of ever combining #headline and h1 in the same element.
The irony is that if you have #fe on #ff, the validator won't
issue a warning, but it will still be "invisible".

-- 
Richard Grevers, New Plymouth, New Zealand
Dramatic Design www.dramatic.co.nz
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Baseline ruled background

[Aaron Gray]

How do I make ruled background ?

Something like a z-index'ed div with ruled baselines.

Many thanks in advance,

Aaron


__
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 replacement techniques and CSS

[Michael Leibson]

- Original Message 
From: David Laakso <[EMAIL PROTECTED]>
To: Michael Leibson <[EMAIL PROTECTED]>
Cc: css discuss 
Sent: Wednesday, August 8, 2007 11:03:10 AM
Subject: Re: [css-d] image replacement techniques and CSS

Michael Leibson wrote:
>> I've a question about image replacement techniques and CSS.  For details, 
>> please see:  
>> http://members.distributel.net/~leibson/Gilder-Levin.htm 


>Image replacement is more a means of putting heading content in your 
>file as text. . . .

Hi, David.  Thanks for replying. 
Yes, I'm aware of its use, and am having no trouble using it.  The question I 
have
is strictly about how to add padding to the  that contains the text 
without, in the process,
also adding padding around the image.  As far as I can tell, those two effects 
are inseparable,
so I imagine there must be another way to do it -- eg, somehow using more than 
just the  and the 
.  

I'm surprised that yours has been the only response on this topic.  From the 
many well-written (and
well-presented) web-sites on the subject, I'd gotten the impression that image 
replacement 
is fairly commonly used, and expected that it would be well-known among the 
number
of really good web designers using this list.  

I'll put this particular problem on the back burner, for now.

All the best,
Michael











  Get news delivered with the All new Yahoo! Mail.  Enjoy RSS feeds right 
on your Mail page. Start today at http://mrd.mail.yahoo.com/try_beta?.intl=ca
__
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 background position bug demo

[Snadden Tim]

Recently I needed to set a background image on  in order to create
full height faux columns. I found that if font size is set on 
that IE still uses the default font size to position the background
image. To get around it I ended up putting the background image on a div
instead. 

Here is a demo:
http://snadden.com/demo/ie-background.htm

Has anyone else come across this before? Are there any other ways around
this?

Thanks, Tim 
This email with any attachments is confidential and may be subject to legal 
privilege.  
If it is not intended for you please reply immediately, destroy it and do not 
copy, disclose or use it in any way. 
__
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] My Sliding Door's Stuck!

[Jeff Ferrell]

Hi, folks!

I'm working up a template site you can see here: http:// 
www.rchseaglesnest.org/new

The "Feature" tab on the left side of the page is new for me. Rather  
than cheat and include it as part of the header graphic, I decided to  
try making it float over top of the layout and have live type  
(instead of graphic) in it.

I'm using the "sliding door" technique for the first time, and have  
some questions, if anyone has a minute to answer them:

(1) Functionally, the tab is there only as an attention-grabber, to  
break up the grid a little. I'm using the "link on top of a list  
element" structure from A List Apart, though, so it's not quite what  
you'd call semantically marked-up, I guess. Is there another way to  
achieve this effect without making a list of one element?

(2) Try as I might, I can't get the left edge of the tab clear of the  
rounded-corner edge (if you look closely, you can see the straight  
edge poking out on the left side). I'm not sure what I'm doing wrong.  
If I add a margin to the left side of the li, it just seems to shove  
the whole thing over, and padding, of course, doesn't affect the  
background...

The page's stylesheet is at http://www.rchseaglesnest.org/new/ 
style.css -- the section for the tab is marked with a comment, about  
half-way down.

Thanks for any help!
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] Looks fine on my IE6 but not others

[Jim Nannery]

Afternoon Tim

You wrote

> I'm hoping someone can detect and substantiate this issue for me
> because I'm flying blind. The site is http://www.rst.uiuc.edu. It
> validates fine and looks fine in IE6 on my desktop but another person
> on campus says when they look at the site (also in IE6), the main
> content is pushed down until it clears the left-hand menu.
>
> Relevant CSS is http://www.rst.uiuc.edu/css/fonts.css and base.css.
>
> Any help is greatly appreciated.
>
> -Tim
> -- 

I don't see any problems in IE 6 Win XP Pro SP 2.  Holds together from font 
size medium to largest and at a variety of screen resolutions from 800 x 600 
to 1280 x 1024... iow... It's not dropping content that I can see.

I didn't look at any other browsers

One small nit to pick at 800 x 600 the text next to the photo of 
Director McDonald wraps to several lines.. It starts
"Th
e
Dep
art
me
nt
etc.
until it clears the photo. A similar situation exists with the text next to 
the photo in the "Graduation Celebration" section.

hth

Jim Nannery
www.redfernenterprises.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] Looks fine on my IE6 but not others

[Tim Offenstein]

I'm hoping someone can detect and substantiate this issue for me 
because I'm flying blind. The site is http://www.rst.uiuc.edu. It 
validates fine and looks fine in IE6 on my desktop but another person 
on campus says when they look at the site (also in IE6), the main 
content is pushed down until it clears the left-hand menu.

Relevant CSS is http://www.rst.uiuc.edu/css/fonts.css and base.css.

Any help is greatly appreciated.

-Tim
-- 
<><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><><>
  Tim Offenstein  ***  College of Applied Health Sciences  *** 
(217) 244-2700
CITES Departmental Services Web Specialist  *** 
www.uiuc.edu/goto/offenstein

__
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] Trouble with display of background in IE

[Holly Bergevin]

From: Paul Menard <[EMAIL PROTECTED]>

> why IE 7 & 6 are cutting  
>off the first line of text in the quotes display. Here is the page
>http://staging.williscoatings.com/

Try adding the two properties below -  

#l_sidebar #wp_quotes .wp_quotes_quote {
background: url(images/quote.png) repeat-y;
padding: 0px 15px;
text-indent: 45px;
text-align: left;
margin-top: -15px;
line-height: 140%;
position: relative; /* add this */
z-index: 2; /*also add this */
}

To help IE get the stacking order right.

~holly 
 
   
__
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] Photo grid with captions in CSS. Any ideas?

[Malcolm N]

On Wed, 08 Aug 2007 13:43:56 -0400,  E Michael Brandt
<[EMAIL PROTECTED]> wrote:

>I will tinker with it later when I get a chance, but really don't  you 
>think 340 by 250 is humungous for a thumbnail? Perhaps you are not 
>really looking for thumbnail page styling?
>
>--
>

Yes - humungus is the word. ;-)

No - I was rather looking for better way to display a small photo
album - say a page with 10 images about that size and not use
thumbnails.

Up until now I have been giving each photo a div - floated left


 
xxx


keeping to keep the text photo legend within the same width as the
photo I have had to use a selection of css rules or determine the size
with php - but as I say this must be inefficient / bloated etc.

I thought your idea rather better - 



__
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] IE6 will not drop down a list.... please help

[Holly Bergevin]

From: "Roelf D. Kuitse" <[EMAIL PROTECTED]>

> IE6 will not drop the list down when you hover over it.  Any
>Ideas??? 

>www.autodata.com/test/test

Well, I could not find the csshover.htc file, (which may be what you are using 
to control the dropdowns in IE6) so perhaps the browser is having the same 
difficulty. Check the path to the file and make sure that it's really there.

~holly 
 
   
__
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] mixed units for table padding

[david]

Trevor Nicholls wrote:
> I hope this requirement is simple!
> 
> I am trying to align a table caption with a table cell.
> The table has a 2 pixel border.
> The table cell has 0.25em padding.
> This means that the table caption needs padding of 0.25em + 2px.
> The browser is IE.
> 
> Is this possible without making assumptions about font sizes?
> 
> Relevant lines from the current CSS file:
> 
>   body {
> font-size: small;
>   }
> 
>   table {
>   /* NB */
>   /* IE tables don't inherit font-size */
> font-size: 1em;
> border: thin solid black;
>   }
> 
>   th, td {
> padding: 0.25em;
>   }
> 
>   table caption {
> caption-side: top;
>   /* NB *
>   /* padding needs extra allowance for border */
> padding: 0.25em;
>   }

Fractional ems combined with pixels? I think you're just asking for 
rounding errors ...

-- 
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] Menu broken in IE - Please help!

[Ray Leventhal]

Timothy Burgin wrote:
> Hi Ray,
>
> I thought I had validated the CSS before, but now all is fixed and  
> validates fine.  I don't have MS IE on my iMac yet, so I'm waiting on  
> a screen shot from browsershots.org to see if this has helped.
>
> Thanks,
> Timothy
>   
Hi Tim,

Sadly, even though the CSS does now validate, I'm still seeing the same
vertical layout of your menus as before. (Win/IE7)

I really love the look of your double horizontal menus in FF (and Opera
and Safari), though, and am eagerly waiting for someone who's more
experienced than I am at this to help find a solution.

Best,
~Ray
__
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] Photo grid with captions in CSS. Any ideas?

[Malcolm N]

On Wed, 08 Aug 2007 10:40:37 -0400,  E Michael Brandt
<[EMAIL PROTECTED]> wrote:

>I am just seeing this thread now.  So perhaps you already have all the 
>answers you need.  But if not, take a look at Thierry's simple css solution:
>
>http://tjkdesign.com/articles/how_to_style_thumbnail_and_caption.asp
>
>

Interesting idea  Michael

I tried using it with images rather larger - i.e 340 x 250 px and it
broke

I did change the + / - 10.5em margin to suit - but the text is on top
of the image and the images misalign 

Will this technique work for this larger image size ?

Malcolm

__
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] Menu broken in IE - Please help!

[Timothy Burgin]

Hi Ray,

I thought I had validated the CSS before, but now all is fixed and  
validates fine.  I don't have MS IE on my iMac yet, so I'm waiting on  
a screen shot from browsershots.org to see if this has helped.

Thanks,
Timothy

On Aug 8, 2007, at 12:04 PM, Ray Leventhal wrote:

> Timothy Burgin wrote:
>> Hi all,
>>
>> I have a double horizontal drop down menu that I've finally gotten to
>> work in Firefox and Safari, but fails miserably in MS IE 5.5-7.  It
>> seems I have 2 issues:
>> 1. The background behind the menu bar repeats itself and is not
>> properly positioned under the above background image.
>> 2. The menu items do not list horizontally, but vertically.
>>
>> The site is at: http://www.yogabasics.com/cms
>>
>> Any ideas on what the problem could be???
>>
>> Thanks,
>> Timothy
>> _ 
>> _
>> 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/
>>
> Hi Tim,
>
> A couple of things.
>
> I looked at the code and css, but the fact that your css has many  
> errors
> [1] will definitely inhibit any debugging, or at very least, make it
> much more difficult to obtain help.
>
> Of particular concern are the errors regarding margin syntax which
> should not have commas between the values, but spaces.
>
> Perhaps some of the IE woes will go away when this is straightened  
> out.
>
> [1]
> http://jigsaw.w3.org/css-validator/validator? 
> profile=css21&warning=0&uri=http%3A%2F%2Fwww.yogabasics.com%2Fcms%2F
>
> HTH,
> ~Ray
>
> __
> 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] Centered, 100% height div in FF, IE6, IE7 when text overflows

[David Ruggles]

I've very sorry to waste your time. Thank you for trying to look at this for
me.

I sent this email on Mon Aug 6th and then figured out the problem on my own.
Since I didn't see the email show up on the list I assumed I hadn't sent it
correctly so I didn't send an email saying I had figured it out.

Thanks,

David Ruggles
CCNA MCSE (NT) CNA A+
Network EngineerSafe Data, Inc.
(910) 285-7200  [EMAIL PROTECTED]



-Original Message-
From: Andrea Black [mailto:[EMAIL PROTECTED] 
Sent: Wednesday, August 08, 2007 11:20 AM
To: David Ruggles; css-d@lists.css-discuss.org
Subject: RE: [css-d] Centered, 100% height div in FF, IE6,IE7 when text
overflows


Sorry but your link is broken...

~ Lacuna


__
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] Menu broken in IE - Please help!

[Timothy Burgin]

Hi all,

I have a double horizontal drop down menu that I've finally gotten to  
work in Firefox and Safari, but fails miserably in MS IE 5.5-7.  It  
seems I have 2 issues:
1. The background behind the menu bar repeats itself and is not  
properly positioned under the above background image.
2. The menu items do not list horizontally, but vertically.

The site is at: http://www.yogabasics.com/cms

Any ideas on what the problem could be???  (And sorry if you received  
this twice, it didn't seem to be sent out the first time)

Thanks,
Timothy
__
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] content little off in FF

[btwien]

Hello,

My 2nd message today...;-)

I had trouble in the past displaying my content right in IE7, but that I solved
2 days ago...The funny thing now it though, that my content is a little off in
FF, while before that was not a problem at all...

It has to do with this little piece of coding:

margin-left:80px !important; /* was 103, for IE only */
margin-left:100px; /* was 80, FF */

As you can see I have been playing around with the numbers, but cannot seem to
get it perfectly played in both browsers?!

See: http://www.cmamali.org/koutiala.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] Photo grid with captions in CSS. Any ideas?

[Tobias Parent]

Have you read "More Eric Meyer on CSS" yet? Project 2 addresses exactly 
this situation.

 Regards!
 - Toby

__
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] Menu broken in IE - Please help!

[Ray Leventhal]

Timothy Burgin wrote:
> Hi all,
>
> I have a double horizontal drop down menu that I've finally gotten to  
> work in Firefox and Safari, but fails miserably in MS IE 5.5-7.  It  
> seems I have 2 issues:
> 1. The background behind the menu bar repeats itself and is not  
> properly positioned under the above background image.
> 2. The menu items do not list horizontally, but vertically.
>
> The site is at: http://www.yogabasics.com/cms
>
> Any ideas on what the problem could be???
>
> Thanks,
> Timothy
> __
> 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/
>   
Hi Tim,

A couple of things. 

I looked at the code and css, but the fact that your css has many errors
[1] will definitely inhibit any debugging, or at very least, make it
much more difficult to obtain help.

Of particular concern are the errors regarding margin syntax which
should not have commas between the values, but spaces.

Perhaps some of the IE woes will go away when this is straightened out.

[1]
http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fwww.yogabasics.com%2Fcms%2F

HTH,
~Ray

__
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] mixed units for table padding

[Trevor Nicholls]

I hope this requirement is simple!

I am trying to align a table caption with a table cell.
The table has a 2 pixel border.
The table cell has 0.25em padding.
This means that the table caption needs padding of 0.25em + 2px.
The browser is IE.

Is this possible without making assumptions about font sizes?

Relevant lines from the current CSS file:

  body {
font-size: small;
  }

  table {
  /* NB */
  /* IE tables don't inherit font-size */
font-size: 1em;
border: thin solid black;
  }

  th, td {
padding: 0.25em;
  }

  table caption {
caption-side: top;
  /* NB *
  /* padding needs extra allowance for border */
padding: 0.25em;
  }
  
Cheers
Trevor


__
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] Help, Please: Another CSS Image Gallery, Positioning Issues

[J Hodge]

Thank you to Michael McEwen, Andrea Black, and Fora.

I managed to get things positioned roughly the way I
would like and displaying reasonably correctly in
Firefox 2, IE7, Opera 9, and Safari for PC.  

However, as Andrea and myself have both noted, it does
not seem to be displaying correctly in IE6. 
Specifically, mousing over the thumbnails does not
produce anything in the "full image" area or the
"description" area, unlike in the other browsers.

Current test code is located at:
http://www.lostinxlation.net/sandbox2/gallery1a.html

And current test CSS is located at:
http://www.lostinxlation.net/sandbox2/css/primary.css
(look near the bottom of the file for the styles
applicable to the gallery)

And, again, this is based from Dynamic Drive's
example:
http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/
which states that it works in IE6+.

Any thoughts on what may be causing the lack of
display in IE6?  Is this an issue of needing
positioning overrides for IE6?

Thank you to all who have assisted so far, and in
advance to everyone for your time and attention.

~~J.
"treswife -at- gmail -dot- 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] Centered, 100% height div in FF, IE6, IE7 when text overflows

[Andrea Black]

Sorry but your link is broken...

~ Lacuna

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of David Ruggles
Sent: 06 August 2007 21:40
To: css-d@lists.css-discuss.org
Subject: [css-d] Centered, 100% height div in FF, IE6,IE7 when text
overflows

I have a page (http://sdemo.safedataisp.net/test.html)

With a very simple setup:
HTML 4.01 Strict
All style information via css

I want to create a page that has a white center with blue borders. If
the
contents of the page are less then the screen height I want the white to
continue to the bottom of the screen, if the contents of the page are
more
then the screen height I want the white to continue to the end of the
contents.

If you look at the example link it looks correct in IE6 but incorrect in
both FF and IE7.

While the IE6 rendering is how I want it to look, IE7 matches how I
would
expect it to look the way the css is currently written.

FF looks correct until I put some text in the div then it doesn't do
anything I would expect.

I want to learn more so if anyone can not only tell me what to do but
why I
would be very grateful.

Thanks,

David Ruggles
CCNA MCSE (NT) CNA A+
Network EngineerSafe Data, Inc.
(910) 285-7200  [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-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] indenting text not in a tag.

[Andrea Black]

Hi Ross,

Is there a reason why you can't use margin's instead? Are the graphics
to not indent as well? Do you have a link we can see?

~ Lacuna

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Ross Hulford
Sent: 08 August 2007 09:17
To: css-d@lists.css-discuss.org
Subject: [css-d] indenting text not in a tag.

I have a news page like this





Archive News 1

item 1 

This is ny news item

Archive News 2

Item 2 

This is another news item


Archive News 3

Item 3 

This is another news item




This goes on forever. I need to indent all the text but when I use 

#container {
text-indent :30px;

}

the two spans indent but the ordinary text does not indent. Is there a
way other than wrapping in  tags to get them to indent. This page is
very long so adding  tags would take ages.


R.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
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] Trouble with display of background in IE

[Andrea Black]

Hi Paul,

Firstly I would say completely take out the wp_quotes div and where you
have the div with the 'wp_quotes_quote' class it doesn't have to be a
div tag, it could be a P tag and this would also help with validation.
Secondly I would say to put a float:left; on the image, put it within
the new  tag and then you should have your solution.

Maybe kind of like this


http://staging.williscoatings.com/wp-
content/themes/willis/images/quote-top.png" alt="" />   I am so pleased
withthe results! I can't say enough about the professionalism
of  Allen's team. It was a great experience and I will work
with you allagain in the future.
— Sally Hayes
http://staging.williscoatings.com/wp-
content/themes/willis/images/quote-bot.png" alt="" />


Hope this helps...

~ Lacuna

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Paul Menard
Sent: 07 August 2007 20:51
To: css-d@lists.css-discuss.org
Subject: [css-d] Trouble with display of background in IE

Greetings all,

I'm scratching my head trying to figure out why IE 7 & 6 are cutting  
off the first line of text in the quotes display. Here is the page
http://staging.williscoatings.com/. Actually it's any page on the  
site since they all contain the sidebar code.

The quote box appears fine in FF2. But in IE the first line is  
chopped. I'm sure this is some conflict with the quote box top image,
http://staging.williscoatings.com/wp-content/themes/willis/images/ 
quote-top.png, the negative margin on the div container for the quote  
text and the background repeating image, http:// 
staging.williscoatings.com/wp-content/themes/willis/images/quote.png

I'm not seeing a solutions but thought I would ask the group. the  
client really wants the text adjacent to the double quotes not under it.

Paul
__
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] IE6 will not drop down a list.... please help

[Ray Leventhal]

Roelf D. Kuitse wrote:
> I have been working at converting our webpage to pure xml and css and I
> though I had accomplished this until yesterday.  I have a drop down
> horizontal menu at the top of my page that I created with css and xml
> but IE6 will not drop the list down when you hover over it.  Any
> Ideas??? 
>
>  
>
> www.autodata.com/test/test
>
> 
>   
Hi Roelf,
I ran into something like this recently and with the moderator's
permission, I'll post this though it is a markup issue, not a CSS issue.

As it happens, when you nest one  within another, the nested 
must be in an  from the parent :
example


Some item
Some item
Some item


Some child item
Some child item
Some child item
 

 <--end parentlist -->

This should help, at least somewhat.

Regards,
~Ray

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

Re: [css-d] How a div can expand according to its content?

[Andrea Black]

I might be misunderstanding but why do you want the container width to be 300px 
wide and expect the 400px input box to not poke out the side? If you stick a 
large box in a small bag the box will have to poke out the top of the bag

~ Lacuna

-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of tao yang
Sent: 07 August 2007 08:30
To: css-d@lists.css-discuss.org
Subject: [css-d] How a div can expand according to its content?

Hi all.
I am a new guy in this list, and this is my first e-mail.When I write the HTML, 
I met a problem: when I put a  with width, for example 400px, 
into a Div with a shorter width(300px),  the  Input will  poke the right edge 
of the div.
In IE6, this will not happen.input is wrapped just well in div. I know this is 
IE6'bug, but that's the way I want.In firefox and IE7, disaster happen,  
just poke the Div'right edge.
I try to use the style "display: table-cell" to the outer div, firefox works 
well. But IE7 dosen't support this table-cell.
I wonder if there is a way for IE7 which could fix the problem?Thank you very 
much.
And here is the HTML files.
HTML---

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
http://www.w3.org/1999/xhtml"; xml:lang="en">

test文件


















-
Thanks again for tolerating my poor ENGLISH.

   
-
抢注雅虎免费邮箱3.5G容量，20M附件！ 
__
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 replacement techniques and CSS

[David Laakso]

Michael Leibson wrote:
> Hi,
>
> I've a question about image replacement techniques and CSS.  For details, 
> please see:  
>
> http://members.distributel.net/~leibson/Gilder-Levin.htm 
>
> Thanks.
>
> - Michael
>
>
>
>
>
>
>
>   


I am not sure how to answer your question /or/ if I can answer it at all.

In a situation where you want to use a /particular heading font/ that is 
not available on any or all cross user operating systems, you can set 
that font (providing you have on your system) as an image using Photoshop.

Image replacement is more a means of putting heading content in your 
file as text. And then overlaying that text /with an image of the text 
in the particular font/ that is not available on any or all cross user 
operating systems. You get the advantage of providing the particular 
font /you/ want in your headings without compromising (maybe) the 
benefits of accessibility.

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] CSS Styled form not displaying properly in IE

[Andrea Black]

Hi John,

I can not see your code but I would make sure that 'File' and 'Comment'
are in labels and then apply float:left and width's to both label and
input styles

File


Comment


I.E.

LABEL {
clear:both;
float:left;
width: 130px;
}

LABEL {
float:left;
width: 130px;
}

~ Lacuna

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of John Szaszvari
Sent: 05 August 2007 07:53
To: css-d@lists.css-discuss.org
Subject: [css-d] CSS Styled form not displaying properly in IE

Hi all,

A small issue here.

My CSS Styled form works 100% In Firefox but in IE the form is a bit
wacky

Here is a screenshot, Top section is FF, Bottom is IE

http://www.johnsz.com/ieproblem.JPG

I have tried so much but cant resolve this,

Here is the code for the form in HTML


Upload a Image

File: 
Comment: 







and the CSS for the Form

label
{
width: 4em;
float: left;
text-align: left;
clear: both

}

.input-box
{
margin-left: 20px;
color: #26a;
background: #feb;
border: #26a solid 1px
}

.submit-button
{
margin-left: 1em;
clear: both
color: #000;
background: #fb0;
border: 2px #9cf outset

}

fieldset
{
display: inline;
border: #26a solid 1px;
width: 25em
}

legend
{
background: #fb0;
border: #26a solid 1px;
padding: 1px 10px

}




Any ideas? Am quite stuck on this one,

Cheers

-- 
Regards,

John Szaszvari
__
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] IE6 will not drop down a list.... please help

[Roelf D. Kuitse]

I have been working at converting our webpage to pure xml and css and I
though I had accomplished this until yesterday.  I have a drop down
horizontal menu at the top of my page that I created with css and xml
but IE6 will not drop the list down when you hover over it.  Any
Ideas??? 

 

www.autodata.com/test/test

 

Thank you,

 

Roelf D. Kuitse

__
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] Tables problem in a two columns layout.

[Ahmed Essam]

I'm making a two columns layout for my website...
I face a problem in internet explorer when I used tables in the contents 
column (the right one)
As the left column is floating to the left, the tables clears the right side 
of that column, although all other
contents sucha s text or images are place correctly..
What can i do?

you can check the page on http://www.ahm531.com/archfoundation.html
See it on IE, thats where the problem occures.

_
Express yourself instantly with MSN Messenger! Download today it's FREE! 
http://messenger.msn.click-url.com/go/onm00200471ave/direct/01/

__
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] Photo grid with captions in CSS. Any ideas?

[E Michael Brandt]

I am just seeing this thread now.  So perhaps you already have all the 
answers you need.  But if not, take a look at Thierry's simple css solution:

http://tjkdesign.com/articles/how_to_style_thumbnail_and_caption.asp


-- 

E. Michael Brandt

www.divaHTML.com
divaGPS : you-are-here menu highlighting
divaFAQ : FAQ pages with pizazz

www.valleywebdesigns.com
JustSo PictureWindow
JustSo PhotoAlbum

-- 
-- 

E. Michael Brandt

www.divaHTML.com
divaGPS : you-are-here menu highlighting
divaFAQ : FAQ pages with pizazz

www.valleywebdesigns.com
JustSo PictureWindow
JustSo PhotoAlbum

--
__
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] Centered, 100% height div in FF, IE6, IE7 when text overflows

[David Ruggles]

I have a page (http://sdemo.safedataisp.net/test.html)

With a very simple setup:
HTML 4.01 Strict
All style information via css

I want to create a page that has a white center with blue borders. If the
contents of the page are less then the screen height I want the white to
continue to the bottom of the screen, if the contents of the page are more
then the screen height I want the white to continue to the end of the
contents.

If you look at the example link it looks correct in IE6 but incorrect in
both FF and IE7.

While the IE6 rendering is how I want it to look, IE7 matches how I would
expect it to look the way the css is currently written.

FF looks correct until I put some text in the div then it doesn't do
anything I would expect.

I want to learn more so if anyone can not only tell me what to do but why I
would be very grateful.

Thanks,

David Ruggles
CCNA MCSE (NT) CNA A+
Network EngineerSafe Data, Inc.
(910) 285-7200  [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] indenting text not in a tag.

[Ross Hulford]

I have a news page like this





Archive News 1

item 1 

This is ny news item

Archive News 2

Item 2 

This is another news item


Archive News 3

Item 3 

This is another news item




This goes on forever. I need to indent all the text but when I use 

#container {
text-indent :30px;

}

the two spans indent but the ordinary text does not indent. Is there a way 
other than wrapping in  tags to get them to indent. This page is very long 
so adding  tags would take ages.


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

[css-d] Trouble with display of background in IE

[Paul Menard]

Greetings all,

I'm scratching my head trying to figure out why IE 7 & 6 are cutting  
off the first line of text in the quotes display. Here is the page
http://staging.williscoatings.com/. Actually it's any page on the  
site since they all contain the sidebar code.

The quote box appears fine in FF2. But in IE the first line is  
chopped. I'm sure this is some conflict with the quote box top image,
http://staging.williscoatings.com/wp-content/themes/willis/images/ 
quote-top.png, the negative margin on the div container for the quote  
text and the background repeating image, http:// 
staging.williscoatings.com/wp-content/themes/willis/images/quote.png

I'm not seeing a solutions but thought I would ask the group. the  
client really wants the text adjacent to the double quotes not under it.

Paul
__
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] Menu broken in IE - Please help!

[Timothy Burgin]

Hi all,

I have a double horizontal drop down menu that I've finally gotten to  
work in Firefox and Safari, but fails miserably in MS IE 5.5-7.  It  
seems I have 2 issues:
1. The background behind the menu bar repeats itself and is not  
properly positioned under the above background image.
2. The menu items do not list horizontally, but vertically.

The site is at: http://www.yogabasics.com/cms

Any ideas on what the problem could be???

Thanks,
Timothy
__
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] 3px IE bug with images

[Nancy E. Sosna Bohm]

I could be wrong, but it looks like it's more of a body issue. Try setting 
body {margin:0; padding:0; border:0;}
(which might be overkill)

--Nancy 

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Travis Killen
Sent: Tuesday, August 07, 2007 10:25 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] 3px IE bug with images

Hi - I'm having some 3px bug in IE.  The images are floated left, but 
are off by 3px, only in IE.   I don't know which hack to use.

http://936webdesign.com/env/


Kind Regards,

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

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

[css-d] problem with opera and moved div

[Tomasz Tybusz]

I made a theme for php-nuke based on css and divs. This is sample page
http://www.nsst.pl/wakacje/modules.php?name=ZClassifieds
I have problem with Opera Browser. Other browsers like IE or Firefox 
display this page correctly. In Opera div named tres is moved on the left.
CSS for this site: 
http://www.nsst.pl/wakacje/themes/wakacjev1/style/style.css
What is wrong?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] How a div can expand according to its content?

[tao yang]

Hi all.
I am a new guy in this list, and this is my first e-mail.When I write the HTML, 
I met a problem: when I put a  with width, for example 400px, 
into a Div with a shorter width(300px),  the  Input will  poke the right edge 
of the div.
In IE6, this will not happen.input is wrapped just well in div. I know this is 
IE6'bug, but that's the way I want.In firefox and IE7, disaster happen,  
just poke the Div'right edge.
I try to use the style "display: table-cell" to the outer div, firefox works 
well. But IE7 dosen't support this table-cell.
I wonder if there is a way for IE7 which could fix the problem?Thank you very 
much.
And here is the HTML files.
HTML---

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
http://www.w3.org/1999/xhtml"; xml:lang="en">

test文件


















-
Thanks again for tolerating my poor ENGLISH.

   
-
抢注雅虎免费邮箱3.5G容量，20M附件！ __
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's filter property can affect unreleated css rendering

[Nathar Leichoz]

Hello fellow designers,I'm using IE's "filter" CSS property and have found that 
when I use it, IE has problems rendering positioned elements on a completely 
different part of the page. I also tried experimenting with IE's "expression" 
value and have found the same problem. Basically anytime I have something 
like:#toolbar {filter:...}or#toolbar {...:expression(...)}it bombs out on 
me.Here is a little testcase. Run it and comment/uncomment the "filter" CSS and 
see that it affects the positioning of the red box. Also try replacing it with 
"width:expression("20px")" and see the same effect.==.box {position:relative; left:100px}.box .outer {border:1px 
solid blue; width:100px; height:100px}.box .outer .inner {border:1px dashed 
red;position:absolute;left:0px;top:0px;margin-left:-20px;
width:20px;height:100px;}.image {border:1px solid orange;
width:50px;height:50px;/* affected line */
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='test.png');}
 
   

==Has anyone experienced this 
before?Regards,Nathar
_
Messenger Café — open for fun 24/7. Hot games, cool activities served daily. 
Visit now.
http://cafemessenger.com?ocid=TXT_TAGLM_AugWLtagline
__
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] Table cell border color in Firefox

[fantasai]

James Eaton wrote:
> My apologies ahead of time if this is a JavaScript problem rather than 
> CSS.  It appears to me to be CSS, but...
> 
> http://zolx.com/test/test.html
> 
> This works correctly in IE6, but not in Firefox 2.0.0.6.  The issue is 
> that when mousing over the header row in Firefox, the effect only works 
> correctly in column one.  In all columns, both the background color and 
> the bottom border color should change, but only the background is 
> changing. 

Looks to me like a bug in Firefox. (Our border-collapse handling is a mess.)
Opera handles it correctly.

BTW, you might want to consider using :hover instead of JavaScript.

Anyway, I added your testcase to
   https://bugzilla.mozilla.org/show_bug.cgi?id=286797
hope you don't mind. :)

~fantasai
__
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] IE6 Contained Div not Expanding

[Samatason Ltd]

Hi

I seem to have fixed this by placing a margin-right: 0; on
#container-node and width: 100%, display: inline; and a margin-right:
0; on #node

Sorry if I wasted anyones time.

Best Regards,

Chris


On 06/08/07, Samatason Ltd <[EMAIL PROTECTED]> wrote:
> Good morning,
>
> I have a problem with a site I'm working on when viewed in IE6 -
> http://sandbox.policyunplugged.net.
>
> It's a 3 column layout with a central fluid width column. In IE7 and
> Firefox my central column expands nicely filling the space between the
> left and right columns but in IE6 there's a gap between the central
> content and the right column.
>
> Any ideas as to the cause?
>
> Best Regards,
>
> Chris Maiden
>
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] IE6 Contained Div not Expanding

[Samatason Ltd]

Good morning,

I have a problem with a site I'm working on when viewed in IE6 -
http://sandbox.policyunplugged.net.

It's a 3 column layout with a central fluid width column. In IE7 and
Firefox my central column expands nicely filling the space between the
left and right columns but in IE6 there's a gap between the central
content and the right column.

Any ideas as to the cause?

Best Regards,

Chris Maiden
__
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] P7 menu -- drops behind div -- BUT ONLY IN NETSCAPE?

[Al Sparber]

From: "Peggy Coats" <[EMAIL PROTECTED]>

>I had a problem where the P7 menu was dropping behind the #content
> div, and, thanks to Gunlaug, got that fixed by adjusting the z-index
> of the #nav.
>
> It seems now to work correctly in all but Netscape browsers.  Any 
> suggestions?
>
> Here's the page:
>
> http://ambientglow.com/garage/floorguy/Web/sample.html#

It's working in Firefox. A question, though...
You've changed the CSS from our tutorial to float your root LIs right, 
instead of left, which makes your menu render backwards. Did you want to do 
that?

-- 
Al Sparber - PVII
http://www.projectseven.com
Extending Dreamweaver - Nav Systems | Galleries | Widgets
Authors: "42nd Street: Mastering the Art of CSS Design"


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

[css-d] 2 things: z-index in IE6,7 and mysterious border behavior

[Nancy Sosna Bohm]

Hello css-discuss list,

There are 2 issues in IE7 and 1 issue in IE6 with this page (and it's many 
websitemates):
http://lfhs.org/lfhs/services/index2.html
http://lfhs.org/lfhs/css/lfhs.css
(sorry the CSS file is so long)

The main bugaboo is the one that occurs in both IE6 and 7:
If you mouse over the last item in the left menu ("Service Opportunities"), 
the flyout displays BEHIND the "Quick Links" border. I tried addressing this 
with z-index declarations, but to no avail.

The other issue is that in IE7, from the time that page first loads until 
you mouse over the menu items, three of the borders of the center table 
(id=bodytable and please don't yell at me for using the table) which are:
3px #70 double;
display as if they are:
3px #70 solid;
Sometimes it even looks like there's text lurking in those borders.

But I am more concerned about the flyout behavior mentioned above.

TIA,
Nancy

__
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 Styled form not displaying properly in IE

[John Szaszvari]

Hi all,

A small issue here.

My CSS Styled form works 100% In Firefox but in IE the form is a bit wacky

Here is a screenshot, Top section is FF, Bottom is IE

http://www.johnsz.com/ieproblem.JPG

I have tried so much but cant resolve this,

Here is the code for the form in HTML


Upload a Image

File: 
Comment: 







and the CSS for the Form

label
{
width: 4em;
float: left;
text-align: left;
clear: both

}

.input-box
{
margin-left: 20px;
color: #26a;
background: #feb;
border: #26a solid 1px
}

.submit-button
{
margin-left: 1em;
clear: both
color: #000;
background: #fb0;
border: 2px #9cf outset

}

fieldset
{
display: inline;
border: #26a solid 1px;
width: 25em
}

legend
{
background: #fb0;
border: #26a solid 1px;
padding: 1px 10px

}




Any ideas? Am quite stuck on this one,

Cheers

-- 
Regards,

John Szaszvari
__
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] Photo grid with captions in CSS. Any ideas?

[Karl Bedingfield]

Hi all,

I have been asked to do a page with about 18 image thumbnails with
captions underneath. Now I know it would be easy to do with tables but
is there a way to do this in CSS?

I have done some searching and a lot seem to position the captions
with javascript. Is there a complete CSS solution?

Many thanks
Karl
__
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] RFC: printing backgrounds by default

[fantasai]

Hello!
I'm a Mozilla developer, and I have a slightly off-topic question for the
members of css-discuss.

As I'm sure many of you have noticed, browsers don't print backgrounds by
default. As David Dorward notes [1], this is in large part to avoid wasting
ink printing pages that weren't designed to be printed.

We'd like to make it possible for designers who /do/ take the time to
consider printing to use backgrounds and have them printed by default.

My suggestion was to automatically allow background printing for any
pages that import an explicit 'print' style sheet, the logic being that
if you've taken the trouble to provide a dedicated style sheet for
print, then we should trust that you are not going to abuse the printer
and allow you use of its ink for your backgrounds. (This is similar to
how Opera employs lots of heuristics to tweak layouts for display on
cell phones, but gives the designer full control if he or she has
specified a style sheet explicitly for 'handheld'.)

My superreviewer David Baron is concerned that this kind of switch would
be confusing to web authors. E.g. importing an empty print style sheet
would suddenly cause all backgrounds to print.

So we want to know what you think: would a switch like this be confusing?
Is there a better way to handle this kind of switch? What are your thoughts
on this problem?

For those who want more details, the bug report is here:
   https://bugzilla.mozilla.org/show_bug.cgi?id=381466

~fantasai

[1] http://archivist.incutio.com/viewlist/css-discuss/91007

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

[css-d] Problems with Firefox and horizontal menu

[Terri Houston]

Sucker Tree Horizontal Menu
www.ttcollectiblegifts.com/dynamicdrive.html

I'm satisfied with the way my menu looks in IE browser, but not in Firefox.  As 
I hover on a top level list item, the background shortens, making the next top 
list item overlap the top of the top link.  Any ideas on why this is happening?

Also, in Firefox, my menu is not nearly as wide as it looks in IE.  How can I 
change this?

I would love to be able to center the menu on my webpages, and not have to 
worry about placing it. Can I do this?

All help is appreciated.

teresamar2 
__
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 problem in Internet Explorer

[Francois Jordaan]

Hi everyone,

Is there a solution for this problem in IE?

http://www.fjordaan.net/tests/z-index.html

It seems that position: relative puts an element higher than any absolutely
positioned elements earlier in the DOM tree.

An example of where this problem occurs is with dynamic dropdown menus in
the header div, going behind the content div because the latter has
position: relative.

Help appreciated,

francois

__
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] simple stop wrapping

[Amy Drayer]

Dear Georg and Lacuna:

Thank you!  I've tried both methods and am still having some small issues.
The double float made the nifty corners borders unhappy (they're very
touchy), so I'm working with the hasLayout code Georg sent (thank you for
the tip on moretools, that was left over from a previous idea and I totally
missed it!).  There's some nesting problems now, so I'm looking for a
solution to get the divs to clear without screwing with the borders.  Mucho
gracias! :-D

-- 
In peace,

Amy M. Drayer
Web Interface Designer
[EMAIL PROTECTED]
http://www.puzumaki.com


On 8/8/07, Andrea Black <[EMAIL PROTECTED]> wrote:
>
> Hi,
>
> Or another solution would be to put a div around everything you want to
> the right of the float left image and put it in a float left div with a
> width.
>
> (Obviously not with css inline like I've done it tho)
>
> 
>
> 
> Stuff here
> Here's my list
> 
>
> (If you want to see it in example... I've done that here with pictures on
> left and the text to the right
> http://www.quizzle.co.uk/quizzle_guide_to_london.asp )
>
>
> ~ Lacuna
>
> -Original Message-
> From: [EMAIL PROTECTED] [mailto:
> [EMAIL PROTECTED] On Behalf Of Gunlaug Sørtun
> Sent: 08 August 2007 03:03
> To: Amy Drayer
> Cc: css-d@lists.css-discuss.org
> Subject: Re: [css-d] simple stop wrapping
>
> Amy Drayer wrote:
>
> > I have an image floating to the left and an h4 and p/ul I want sitting
> next
> > to it.  Right now it's wrapping under the image if the paragraph or list
> is
> > longer than the image.
> >
> > http://new.jocolibrary.org/research (need it quick box)
>
> Add...
>
> #needitquick div img {margin-bottom: 2em; display: inline;}
> #needitquick div form img {margin-bottom: .5em;}
>
> #needitquick div h4 {overflow: hidden; margin: 0;}
> * html #needitquick div h4 {overflow: visible; height: 100%;}
>
> #needitquick div p {overflow: hidden;}
> * html #needitquick div p {overflow: visible; height: 100%;}
>
> ...which will introduce 'block formatting' in standard-aware browsers,
> and add a 'hasLayout' trigger for old IE6. The result is self-adjusting
> line-up with no wrapping under the image.
> The 2em margin bottom on images will secure the effect even when
> subjected to a reasonable amount of font resizing.
>
> > And what's up with ul/li wrapping weird in the "More research tools" in
> IE
> > at:
> > http://new.jocolibrary.org/default.aspx?id=2150
>
> IE's reaction to...
>
> #moretools li {
>list-style-position:inside;
> }
>
> Delete that style and IE will render ok.
>
> 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-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Background disapearing in IE

[Hakan K]

Try adding position





Thanks
Hakan
http://wirefan.com

On 8/8/07, Marcelo Wolfgang <[EMAIL PROTECTED]> wrote:
>
> Hi list,
>
> I have a problem with a site I made, in flash and with simple css, that
> I can't figure out why the background of the site doesn't show up when
> the user refresh ( F5 ) the page.
>
> It simply don't show
>
> The url is www.bottero.net
>
> Any advices would be good
>
> TIA
> Marcelo Wolfgang
> __
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> IE7 information -- http://css-discuss.incutio.com/?page=IE7
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Background disapearing in IE

[Marcelo Wolfgang]

Hi list,

I have a problem with a site I made, in flash and with simple css, that 
I can't figure out why the background of the site doesn't show up when 
the user refresh ( F5 ) the page.

It simply don't show

The url is www.bottero.net

Any advices would be good

TIA
Marcelo Wolfgang
__
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] Layout fixed, new problem with background-position

[Andrea Black]

Hi Nick,

I would recommend that instead of background-position you use the hover
attribute.

So sort of like this:
A {
background-image:none;
width: 130px;
}

A:hover {
background-image:url("mynewimage.jpg");
}


Now I've not actually tested that method this moment but I believe
that's how I did mine last time. Also just a small mention that since
your menu is in fact a list I'd recommend that in the future you use UL
and LI for your menu items instead of DIV's and it will help you out
greatly when sorting your CSS.

~ Lacuna

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Nicholas
Karnick
Sent: 07 August 2007 20:47
To: css-d@lists.css-discuss.org
Subject: Re: [css-d] Layout fixed, new problem with background-position

Ray Leventhal wrote:
> Hi Nicholas,
>
> I'll assume the issue is IE6 only as I've just looked in Win/FF2,
> Win/FF1.5 and Win/IE7 and the site looks great.
>
> ~Ray
>   
Hello Ray,

Correct, it seems to work in every browser I have tested (Firefox 2.0, 
Opera 9.21, Navigator 9.0, and IE7) except IE6.

Nick
__
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] Missing content in IE6, it doesn't scroll al the way down...[fixed]

[Sido van Gennip]

Thanks for the info, it fixed the problem!

Pretty weird bug if, you haven't read about it yet.


On 8/7/07, Holly Bergevin <[EMAIL PROTECTED]> wrote:
>
> From: "Sido van Gennip" <[EMAIL PROTECTED]>
>
> http://www.paardenverzekeringvergelijker.nl/
>
> > in IE6, the bottom
> >of the page seems to be missing...
>
> In - /* reset.css */ - remove the position: relative from the universal
> selector's declarations. Automatically declaring that property value for
> everything can have unpredictable and, as you've discovered, undesirable,
> consequences. Set it only where needed.
>
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Help, Please: Another CSS Image Gallery, Positioning Issues

[Andrea Black]

Also... your large image does not pop up in IE6 for me but does work in
FireFox 2.

~ Lacuna

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Andrea Black
Sent: 08 August 2007 09:03
To: J Hodge; css-d@lists.css-discuss.org
Subject: Re: [css-d] Help, Please: Another CSS Image Gallery,Positioning
Issues

Hi,

I would recommend using float:left (or float:right) on the thumbnails
instead of display:inline, and then give them a width as well

~ Lacuna. 

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of J Hodge
Sent: 08 August 2007 02:02
To: css-d@lists.css-discuss.org
Subject: [css-d] Help, Please: Another CSS Image Gallery, Positioning
Issues

Good evening to everyone.

I am working on implementing another CSS photo
gallery, this time utilizing the one found on Dynamic
Drive at the following URL:

http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/


My live test is at:
http://www.lostinxlation.net/sandbox2/ddrive.html

The applicable styles are at:
http://www.lostinxlation.net/sandbox2/ddrive.css
http://www.lostinxlation.net/sandbox2/css/primary.css


As it sits, the "full size" image is properly located
when displayed.  However, the *thumbnails* need to be
positioned on the right side, to mimic a right
sidebar.  When I attempt to position them using a
margin-left, they display in a stack, even if using
display: inline.  Attempts at absolute positioning
display them piled on top of one another.  Relative
positioning attempts displace the position of the
"full image".

If anybody has any ideas, they would be greatly
appreciated.

Thank you in advance for your time and attention.

~~J.
"treswife -at- gmail -dot- com"
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-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] Help, Please: Another CSS Image Gallery, Positioning Issues

[Andrea Black]

Hi,

I would recommend using float:left (or float:right) on the thumbnails
instead of display:inline, and then give them a width as well

~ Lacuna. 

-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of J Hodge
Sent: 08 August 2007 02:02
To: css-d@lists.css-discuss.org
Subject: [css-d] Help, Please: Another CSS Image Gallery, Positioning
Issues

Good evening to everyone.

I am working on implementing another CSS photo
gallery, this time utilizing the one found on Dynamic
Drive at the following URL:

http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/


My live test is at:
http://www.lostinxlation.net/sandbox2/ddrive.html

The applicable styles are at:
http://www.lostinxlation.net/sandbox2/ddrive.css
http://www.lostinxlation.net/sandbox2/css/primary.css


As it sits, the "full size" image is properly located
when displayed.  However, the *thumbnails* need to be
positioned on the right side, to mimic a right
sidebar.  When I attempt to position them using a
margin-left, they display in a stack, even if using
display: inline.  Attempts at absolute positioning
display them piled on top of one another.  Relative
positioning attempts displace the position of the
"full image".

If anybody has any ideas, they would be greatly
appreciated.

Thank you in advance for your time and attention.

~~J.
"treswife -at- gmail -dot- 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] simple stop wrapping

[Andrea Black]

Hi,

Or another solution would be to put a div around everything you want to the 
right of the float left image and put it in a float left div with a width.

(Obviously not with css inline like I've done it tho)




Stuff here
Here's my list


(If you want to see it in example... I've done that here with pictures on left 
and the text to the right http://www.quizzle.co.uk/quizzle_guide_to_london.asp )


~ Lacuna

-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Gunlaug Sørtun
Sent: 08 August 2007 03:03
To: Amy Drayer
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] simple stop wrapping

Amy Drayer wrote:

> I have an image floating to the left and an h4 and p/ul I want sitting next
> to it.  Right now it's wrapping under the image if the paragraph or list is
> longer than the image. 
> 
> http://new.jocolibrary.org/research (need it quick box)

Add...

#needitquick div img {margin-bottom: 2em; display: inline;}
#needitquick div form img {margin-bottom: .5em;}

#needitquick div h4 {overflow: hidden; margin: 0;}
* html #needitquick div h4 {overflow: visible; height: 100%;}

#needitquick div p {overflow: hidden;}
* html #needitquick div p {overflow: visible; height: 100%;}

...which will introduce 'block formatting' in standard-aware browsers, 
and add a 'hasLayout' trigger for old IE6. The result is self-adjusting 
line-up with no wrapping under the image.
The 2em margin bottom on images will secure the effect even when 
subjected to a reasonable amount of font resizing.

> And what's up with ul/li wrapping weird in the "More research tools" in IE
> at:
> http://new.jocolibrary.org/default.aspx?id=2150

IE's reaction to...

#moretools li {
   list-style-position:inside;
}

Delete that style and IE will render ok.

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