Re: [css-d] Fixed, fluid width and sidebars

[Richard Brown]

Dear David and Gunlaug and All

On 31/10/2007, David Laakso <[EMAIL PROTECTED]> wrote:>
>
> The negative margin concept, explained in this tutorial [1], uses fixed
> sidebars with a fluid center column.  It is one of the most stable,
> robust, cross-browser  layouts known. "Spin-off" variations
> of that concept may be found here [2], and elsewhere on the Web.
>
> [1] 
> [2] 
>
Many thanks for the input and links. I decided on sticking with a pure
flexible width 3 column layout which you can see here:



As you can see I have started to lay down images including one for the
content. However, using percentages means I am finding it hard to work
out the placement of the content image. What technique could I use
please to place the image correctly. i.e. Up against the sidebar.

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
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] gallery thumbnail link issue in IE

[J.C. Johnson]

Nope...the empty span is a fix for forcing vertical centering in IE. See
http://www.brunildo.org/test/img_center.html for the basic technique. I've
done this before but don't recall having this issue come up. On the other
hand, I stripped out some of the CSS this time around since there was no
need to support things like IE on Mac. I was trying to go with the minimum
hacking needed, but didn't foresee this issue, and I'm not sure what will
resolve it. 

Jeniffer



Jeniffer C. Johnson
OffLead Productions
http://www.offlead.com





> -Original Message-
> From: [EMAIL PROTECTED] [mailto:css-d-
> [EMAIL PROTECTED] On Behalf Of E Michael Brandt
> Sent: Wednesday, October 31, 2007 6:11 PM
> To: css-d@lists.css-discuss.org
> Subject: Re: [css-d] gallery thumbnail link issue in IE
> 
> Not sure if this is the cause or not, but  notice the errant, empty
> span
> element in your li's:
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> Shack On My Track
> 
> 
> 
> 
> E. Michael Brandt
> 
> www.divaHTML.com
> divaPOP : standards-compliant popup windows
> divaGPS : you-are-here menu highlighting
> divaFAQ : FAQ pages with pizazz
> 
> www.valleywebdesigns.com/vwd_Vdw.asp
> JustSo PictureWindow
> JustSo PhotoAlbum, et alia
> 
> --
> __
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Photo Gallery issue

[bill scheider]

> ...also working in Netscape 8 and 9; What you're seeing in IE6
> (centering problem) is also happening in other versions of IE, including
7.

Anyone have an idea on this?

Thanks again...

Hi Mark,
In your style sheet at #content4a ul, I added left: 0; after your top
position of 234px. That fixed it in IE 5.5, 6, 7. In ie 5.5 the content on
the right is dropping below the gallery thumbnails, though. Maybe a width or
float problem? Not happening in any of the other browsers I tried it in, so
maybe it's not a problem for you.
hth,
Bill

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Photo Gallery issue

[Mark Kamian]

Fixed this, in case anyone is interested, by adding:

left: 0px;

to

#content4a ul

Thanks!


> > Hi,
> > 
> > I'm trying to use a variation of Stu Nicholls' css photo gallery
> > (http://www.cssplay.co.uk/articles/gallery/), which can be seen here:
> > 
> > http://www.temescalstation.com/properties/40th_Shafter2.asp
> > 
> > In Opera, it's fine.  In Firefox, it's working fine, aside from the unwanted
> > black border on the left and top of the large image.
> > 
> > More importantly however,  in IE 6 the unordered list and corresponding
> > hover image is aligning in the center of the page.  I haven't been able to
> > nail this one down.  Can someone point me in the right direction?
> > 
> > TIA!
> > 
> 
> 
> __
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

_
Help yourself to FREE treats served up daily at the Messenger Café. Stop by 
today.
http://www.cafemessenger.com/info/info_sweetstuff2.html?ocid=TXT_TAGLM_OctWLtagline
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] :: or :

[Philippe Wittenbergh]

On Nov 1, 2007, at 5:58 AM, Micky Hulse wrote:

> Just wondering why the W3C documentation for selectors [1] some  
> patterns
> that use :: and others that use :?
>
> For example, ::before... I have always seen examples that only use one
> :, not ::.
>
> I assume that I am just not understanding the intent/rules of the
> documentation.

CSS2.1 selectors uses the same syntax for both pseudo-classes and - 
elements.
But CSS selectors introduces the different syntax


The single column syntax is for pseudo-classes.
:link, :root, :target, :nth-child(), :not(), etc
double columns are for pseudo-elements
::first-letter, ::first-line, ::selection, ::before, etc

Most relatively recent browsers understand the CSS Selectors syntax  
(even unintentionally, as IE 6).
(that is, if they understand the selector).

BTW, your link to CSS selectors points to an outdated document.

Philippe
---
Philippe Wittenbergh





__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Load order and minimum width -- help!

[David Laakso]

Cancilla, Dominick wrote:
> I'm working on my first CSS/PHP Web site, a redesign of our company Web
> site. Ideally, the site should have no JavaScript.
>
> You can see the first inklings of my design here:
> http://www.calwater.com/dac_test/index.php
>
> I have two issues I could use some assistance with.
>
> 1) How can I get the left menu bar to load after the main content and
> right sidebar? I'd like it to load last for accessibility and
> handheld-device reasons.
>   


I am guessing you are looking for document source order like this:


/Header/
1/ Primary Content-- center col (California Water Service Company)
2/ Secondary Content-- your current right col
3/ Navigation-- your current left col
/Footer/



> 2) If the browser window gets small, the main picture drops below the
> menu bar. I've tried setting a minimum width but it didn't work -- so
> I'm assuming I set it incorrectly. Suggestions?
>
>
>   


Since your center column image is quite wide, a fixed width layout may 
be easiest, and will avoid the float drop issue in a narrow window.

This fixed width layout [1] meets the above source order requirement and 
/may/ work for you at 800.

.


Best,

~dL






-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] gallery thumbnail link issue in IE

[E Michael Brandt]

Not sure if this is the cause or not, but  notice the errant, empty span 
element in your li's:












Shack On My Track




E. Michael Brandt

www.divaHTML.com
divaPOP : standards-compliant popup windows
divaGPS : you-are-here menu highlighting
divaFAQ : FAQ pages with pizazz

www.valleywebdesigns.com/vwd_Vdw.asp
JustSo PictureWindow
JustSo PhotoAlbum, et alia

-- 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Fixed, fluid width and sidebars

[David Laakso]

Richard Brown wrote:
> Basically I want to ask the pros and cons of using fixed width
> sidebars with fluid centre column. Is it a big no no or can I do it
> anyway. Are there reasons not to mix pixel width with fluid centres
> please? In terms of code what would be the best solution with the
> 'purest' code please?
>
> Many thanks.
>   


The negative margin concept, explained in this tutorial [1], uses fixed 
sidebars with a fluid center column.  It is one of the most stable, 
robust, cross-browser  layouts known. "Spin-off" variations
of that concept may be found here [2], and elsewhere on the Web.

[1] 
[2] 

Regards,

~dL

-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] gallery thumbnail link issue in IE

[J.C. Johnson]

Here is the relevant URL: 
http://dev.kiu-art.dk/northern/index.php

CSS for the thumbnail display: 
http://dev.kiu-art.dk/includes/style_thumbs.css

and for IE (called via conditional comment into the page):
http://dev.kiu-art.dk/includes/style_ie.css



It is displaying just fine. But in IE6 & 7 the link doesn't work if you
click ON the thumbnail. If you click anywhere else within the li or anchor,
it works. But clicking directly on the image itself does nothing. Haven't
ever run into this before. 

TIA,
Jeniffer



Jeniffer C. Johnson
OffLead Productions
http://www.offlead.com






__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Fixed, fluid width and sidebars

[Gunlaug Sørtun]

Richard Brown wrote:

> Basically I want to ask the pros and cons of using fixed width 
> sidebars with fluid centre column. Is it a big no no or can I do it 
> anyway.

Of course you can. It's a much used form of layout.

> Are there reasons not to mix pixel width with fluid centres please?

The only problems I know of when using fluid width, is that long
text-lines may become hard to read and images may end being too wide.
Both are solvable by adding min and max width to the entire layout.

> In terms of code what would be the best solution with the 'purest' 
> code please?

I'd recommend using the basic 2-column 'negative margins'[1] solution,
and have 2 percentage-width columns inside the main #container. That'll
give you 1 fluid and 1 fixed-width sidebar and a fluid center.

The 3-column solution described in the same article has 2 fixed-width
sidebars and a fluid center. That one should work just fine too.

regards
Georg

[1] http://www.alistapart.com/articles/negativemargins
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Load order and minimum width -- help!

[Cancilla, Dominick]

I'm working on my first CSS/PHP Web site, a redesign of our company Web
site. Ideally, the site should have no JavaScript.

You can see the first inklings of my design here:
http://www.calwater.com/dac_test/index.php

I have two issues I could use some assistance with.

1) How can I get the left menu bar to load after the main content and
right sidebar? I'd like it to load last for accessibility and
handheld-device reasons.

2) If the browser window gets small, the main picture drops below the
menu bar. I've tried setting a minimum width but it didn't work -- so
I'm assuming I set it incorrectly. Suggestions?

Thanks a big bunch for the help!

--Dominick

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] IE6 png fix problem / behavior property

[Mark Senff]

Hey all,

Here's one of those stupid problems again Let's say my DIV structure is 
like this:


 menu goes here, blablabla


For a specific reason, I want to use a PNG file with alpha transparency as the 
background of the main block. To make that work in IE6, I used a method that 
includes this .HTC file, which is this line in my CSS file

div#pageBlock {behavior: url('/iepngfix.htc');}

However, for the menu block, I do NOT want to use that behavior (since it's 
with mouseover/hovers and dropdowns and Suckerfish and all, it doesn't work if 
that particular behavior is applied to it). How do I override it again with the 
default behavior so that for the menu DIV, it will NOT use the iepngfix.htc? Is 
that at all possible?

Thanks many,
mS

 __
Do You Yahoo!?
Tired of spam?  Yahoo! Mail has the best spam protection around 
http://mail.yahoo.com 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Photo Gallery issue

[Mark Kamian]

> From: [EMAIL PROTECTED]

> The validator ( http://validator.w3.org/ )is showing 77 errors.

Ee gads, that was disgraceful!

OK I've narrowed that down to one error, and am hoping it's not the cause of my 
problem...

> ...also working in Netscape 8 and 9; What you're seeing in IE6
> (centering problem) is also happening in other versions of IE, including 7.

Anyone have an idea on this?

Thanks again...


> Hi,
> 
> I'm trying to use a variation of Stu Nicholls' css photo gallery
> (http://www.cssplay.co.uk/articles/gallery/), which can be seen here:
> 
> http://www.temescalstation.com/properties/40th_Shafter2.asp
> 
> In Opera, it's fine.  In Firefox, it's working fine, aside from the unwanted
> black border on the left and top of the large image.
> 
> More importantly however,  in IE 6 the unordered list and corresponding
> hover image is aligning in the center of the page.  I haven't been able to
> nail this one down.  Can someone point me in the right direction?
> 
> TIA!
> 


_
Peek-a-boo FREE Tricks & Treats for You!
http://www.reallivemoms.com?ocid=TXT_TAGHM&loc=us
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Fixed, fluid width and sidebars

[Richard Brown]

Hi All

I have to build a three column site. Left column will display links
and could expand according to page size. Right column needs to display
photos that will all be sized to 150px and might look weird when the
column is expanded and the centre column can expand as much as it
likes.

Basically I want to ask the pros and cons of using fixed width
sidebars with fluid centre column. Is it a big no no or can I do it
anyway. Are there reasons not to mix pixel width with fluid centres
please? In terms of code what would be the best solution with the
'purest' code please?

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
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] :: or :

[Micky Hulse]

Hi all,

Just wondering why the W3C documentation for selectors [1] some patterns 
that use :: and others that use :?

For example, ::before... I have always seen examples that only use one 
:, not ::.

I assume that I am just not understanding the intent/rules of the 
documentation.

I would love a bit of clarification. :)

Many TIA's!
Cheers,
Micky

[1] 

-- 
Wishlist: 
Switch: 
BCC?: 
My: 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Internet Explorer parsing bug: invalid at-rule not ignored

[Gabriele Romanato]

@media all {
@media screen {
p {color: blue;}
}
}

Only IE (5, 6, 7) will apply the rule, which is invalid according to specs.
I don't know if this has been yet reported.

bye,

Gabriele Romanato

-- 
http://www.css-zibaldone.com/
http://mimicry.css-zibaldone.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Photo Gallery issue

[bill scheider]

Hi,

I'm trying to use a variation of Stu Nicholls' css photo gallery
(http://www.cssplay.co.uk/articles/gallery/), which can be seen here:

http://www.temescalstation.com/properties/40th_Shafter2.asp

In Opera, it's fine.  In Firefox, it's working fine, aside from the unwanted
black border on the left and top of the large image.

More importantly however,  in IE 6 the unordered list and corresponding
hover image is aligning in the center of the page.  I haven't been able to
nail this one down.  Can someone point me in the right direction?

TIA!

Hi Mark,
The page is also working in Netscape 8 and 9; What you're seeing in IE6
(centering problem) is also happening in other versions of IE, including 7.

The validator ( http://validator.w3.org/ )is showing 77 errors. Correcting
some of those may help lots! If not, reposting to the list after you've
fixed the errors will probably make getting some help a bit easier :-)

Hth,
Bill

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Photo Gallery issue

[Mark Kamian]

Hi,

I'm trying to use a variation of Stu Nicholls' css photo gallery 
(http://www.cssplay.co.uk/articles/gallery/), which can be seen here:

http://www.temescalstation.com/properties/40th_Shafter2.asp

In Opera, it's fine.  In Firefox, it's working fine, aside from the unwanted 
black border on the left and top of the large image.

More importantly however,  in IE 6 the unordered list and corresponding hover 
image is aligning in the center of the page.  I haven't been able to nail this 
one down.  Can someone point me in the right direction?

TIA!

_
Boo! Scare away worms, viruses and so much more! Try Windows Live OneCare!
http://onecare.live.com/standard/en-us/purchase/trial.aspx?s_cid=wl_hotmailnews
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] how to handle divs of differing heights

[Gunlaug Sørtun]

Travis Crabtree wrote:
> This page (http://arts.tusculum.edu/arts.html) has an outer container
>  with two inner divs. The problem is that the menu div (on the left) 
> is shorter in height than the content div (on the right). How would 
> you handle that?

> The page displays in IE6/7 without a problem. In this case, it's 
> Firefox, etc. that present the challenge. Also, in Firefox, etc., a 
> bottom div which displays fine in IE doesn't show up.

If IE/win displays it as you want, then it isn't "equal height" you're
looking for, but rather "containing floats". IE does that in your case
because it (IE) is buggy, see: the 'hasLayout'[1] bug.

One (of many) solution is to add...

#main {display: table; clear: both;}

...to make standard compliant browsers "expand container to contain
floats". (I added a 'clear: both' because your layout is a bit weak and
breaks in Gecko at my end.)

You'll find that and other solutions under "containing floats" here...


regards
Georg

[1] http://www.satzansatz.de/cssd/onhavinglayout.html
-- 
http://www.gunlaug.no
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Validation confusion

[Rick Lecoat]

On 31/10/07 (13:56) Jens said:

>Exactly, the cached pages are submitted to the validator, resulting in
>failed validation attempts when trying to import the local (cached)
>Style sheets, which is the same case as Olivier Thereaux and Jens
>Meiert discussed on www-validator-css.
>
>Why the WDT submits the cached pages instead of referencing the online
>pages I do not know. However, apparently the validator team are
>working on the validator's issue with local imports.

Thanks for the clarity Jens. Why the WDT uses two different methods to
send data to the validator I don't know. From now on I'll make sure I
use WDT > Tools > Validate CSS for that task, rather than clicking the
'CSS:valid' checkmark.

Best regards; 
-- 
Rick Lecoat

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] how to handle divs of differing heights

[Travis Crabtree]

This page (http://arts.tusculum.edu/arts.html) has an outer container with
two inner divs. The problem is that the menu div (on the left) is shorter in
height than the content div (on the right). How would you handle that?

I've found one hack that involves stretching the height of the inner divs
and hiding the overflow of the container, but I'm hoping there is a better
way to do this. Also, I'd prefer not to use the "Faux Columns."

The page displays in IE6/7 without a problem. In this case, it's Firefox,
etc. that present the challenge. Also, in Firefox, etc., a bottom div which
displays fine in IE doesn't show up.
I'm hoping there's a better way to handle this than the hack that I've used
previously.

The CSS file may be found here: http://arts.tusculum.edu/arts-box.css


--
Travis Crabtree
Webmaster
Tusculum College
phone: 423.636.7300 ext. 5132
fax: 423.636.7492
email: [EMAIL PROTECTED]


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Why a space in IE7 and not in FF?

[David Laakso]

Marje Cannon wrote:
>
> ORIGINAL QUESTION:
>
> Does anyone know why there is a space at the bottom of the orange box
> (right-hand column) in IE7 but not in FF. 
>  
> I can't seem to correct this problem.
>
> http://www.bgcofmanatee.org/index-future.php
>
> Thanks!
>
> Marje
>   


I did not look at the CSS-- does adding:
img {display:block;}   
close the space?

If so, IE may be getting it right for a change (space for descenders?)?

Best,
~dL

-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Why a space in IE7 and not in FF?

[Marje Cannon]

Thanks to all who helped.

The solution to my question below was to remove the float from the image.

As Georg stated correctly: "IE/win (all versions) has serious problems with
contained floats, and that image is floating"

ORIGINAL QUESTION:

Does anyone know why there is a space at the bottom of the orange box
(right-hand column) in IE7 but not in FF. 
 
I can't seem to correct this problem.

http://www.bgcofmanatee.org/index-future.php

Thanks!

Marje


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Validation confusion

[Jens Brueckmann]

> It's definitely something with the way the FF Web Developer Toolbar
> (hereafter WDT) works. If I select (from the WDT) Tools > Validate CSS,
> it validates fine.
> However, if I activate the WDT's 'Show page validation' (also under
> 'Tools') then click on the green button with the checkmark that says
> "CSS: valid", it chokes -- apparently looking for a local file.

Exactly, the cached pages are submitted to the validator, resulting in
failed validation attempts when trying to import the local (cached)
Style sheets, which is the same case as Olivier Thereaux and Jens
Meiert discussed on www-validator-css.

Why the WDT submits the cached pages instead of referencing the online
pages I do not know. However, apparently the validator team are
working on the validator's issue with local imports.

Cheers,

jens
-- 
Jens Brueckmann
http://www.yalf.de
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Validation confusion

[Rick Lecoat]

On 31/10/07 (12:47) Jens said:

>Rick, are you sure, you checked the page online, because the error
>states it cannot retrieve a local file:
>file://localhost/MeyerReset.css

Hi Jens;

It's definitely something with the way the FF Web Developer Toolbar
(hereafter WDT) works. If I select (from the WDT) Tools > Validate CSS,
it validates fine.
However, if I activate the WDT's 'Show page validation' (also under
'Tools') then click on the green button with the checkmark that says
"CSS: valid", it chokes -- apparently looking for a local file.

Same page.

And this is now probably straying too far OT so I should draw a line
under it, but I thought others might be interested to hear about this
idiosyncrasy.

Cheers;
-- 
Rick Lecoat

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Validation confusion

[Jens Brueckmann]

> 1File not foundimport file://localhost/MeyerReset.css: 
> Operation
> not permitted
>
> Is this a known issue with the WDT or am I doing something wrong?
> (Apologies if this last bit has strayed OT slightly). Oh, the page being
> checked is online, not local, if that helps.

Rick, are you sure, you checked the page online, because the error
states it cannot retrieve a local file:
file://localhost/MeyerReset.css

This is a known issue with the CSS validator, see:

http://lists.w3.org/Archives/Public/www-validator-css/2007Oct/0027.html

Cheers,

jens

-- 
Jens Brueckmann
http://www.yalf.de
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Validation confusion

[Rick Lecoat]

On 31/10/07 (11:49) Jens said:

>I believe the error is caused by your printing Style sheet - it
>actually cannot be found, the referenced file returns a 404 error

A-ha!
Thanks Jens; in that case I won't worry about it (the print stylesheet
is currently empty as I haven't done that bit yet) but it's a good
reminder to upload the empty stylesheet to avoid the 404.

Now that's resolved I'm getting a new weirdness: Validating the page(s)
directly at  gives me a clean bill
of health, but doing so by clicking the CSS:valid button in the FF web
developer toolbar gives the following from the referenced page:

1File not foundimport file://localhost/MeyerReset.css: Operation
not permitted
2   File not foundimport file://localhost/templateStyle.css: 
Operation
not permitted
3   File not foundimport file://localhost/typeStyle.css: Operation 
not
permitted

Is this a known issue with the WDT or am I doing something wrong?
(Apologies if this last bit has strayed OT slightly). Oh, the page being
checked is online, not local, if that helps.

thanks again;

-- 
Rick Lecoat

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] IE Flicker on hover problem

[James Leslie]

> It is the problem of IE6 reloading background images in links every 
> time they are hovered on.
>
> I am using a sliding doors style technique for a few tabs as shown at 
> http://jamestesting.metafaq.com/clients/jamestesting/debug.html  (CSS 
> in
> head) whenever they are hovered over in IE6 the image is reloaded 
> causing a flicker.
>
> I can't really do anything to the server to try to fix this (even 
> though there seems to be a Dean Edwards solution via that means) and 
> would really like it to be a CSS fix.
>
> At the moment the only thing I can think of is to try to position 
> another image directly behind it so that the under-image is shown when

> the top one disappears but this will add superfluous code I would 
> prefer to avoid.
>
My solution is to use the approach that has been christened "Css
sprites" - you create one background image which contains both the
hovered and unhovered states (whether they are arranged vertically or
side by side depents on the context) and alter the background-position
upon hover. I usually find that there is a nett saving in total
bandwidth as well as requiring one fewer requests.

--
Hi Richard,

It is a slightly different problem to the 2 images for hover/normal
states vs CSS sprites. 
Unfortunately IE6 decides to reload an image each time it is hovered
over leading to a flicker effect at best, and for larger images a loss
of image for a short while. It also increases band width as the image is
reloaded. 
This happens if users have "Reload every visit to page" set in the
browser.

There is a detailed article on it at:
http://www.fivesevensix.com/studies/ie6flicker/

James



__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Validation confusion

[Jens Brueckmann]

Hi Rick,

> according to the FF web developer toolbar's 'Display page validation'
> feature the CSS validates, but if I click to jump to the validator
> itself it throws up the following error :
>
> Lexical error at line 488, column 2. Encountered: "h" (104), after : "<"

> The error appear on both pages:
> 
> 

I believe the error is caused by your printing Style sheet - it
actually cannot be found, the referenced file returns a 404 error:

http://sandbox.sharkattack.co.uk/novaRebuild/css/print.css

Cheers,

jens
-- 
Jens Brueckmann
http://www.yalf.de
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Validation confusion

[Rick Lecoat]

Hi all;

I have a site-in-progress that has just two working pages right now;
according to the FF web developer toolbar's 'Display page validation'
feature the CSS validates, but if I click to jump to the validator
itself it throws up the following error :

Lexical error at line 488, column 2. Encountered: "h" (104), after : "<"

Seaching for a < symbol in my various style sheets has turned up nothing
(searching for 'h' of course turned up plenty, but nothing that seemed
like an error) so I can't work out where this error is coming from. Is
it a glitch in the validator? Is it a serious problem in my css? Can I
ignore it? Or is it simply due to the fact that the page contains PHP code? 

The error appear on both pages:



Any help would be much appreciated, as always.
Thanks;
-- 
Rick Lecoat

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/