Re: [css-d] IE 6 Layout Problem

[Duckworth, Nigel]

Many thanks Georg, that did it. I must have violated my Photoshop template and 
made that image too wide somehow. 

Thanks again, 

-Nigel 


-Original Message-
From: Gunlaug Sørtun [mailto:gunla...@c2i.net] 
Sent: Sunday, February 15, 2009 7:26 PM
To: Duckworth, Nigel
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] IE 6 Layout Problem


Duckworth, Nigel wrote:

> I'm on a tight deadline so thought I'd throw this out there. I have a  
> problem in IE6, from BrowserCam it looks like the right column with 
> the main content is dropping.
> 
> http://tinyurl.com/c9ybfs

Content (the image) inside #pma too wide - there's 10px side-paddings on that 
element, and IE6 and older don't respect declared dimensions when content is 
too wide.

Only solutions that seem to work without causing other problems, is to either 
make the relevant image slightly narrower, or to make it appear narrower for 
IE6 by adding something like...

* html #pma img {margin-right: -10px;}

regards
Georg
-- 
http://www.gunlaug.no
__
css-discuss [cs...@lists.css-discuss.org]
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] IE 6 Layout Problem

[Duckworth, Nigel]

Hi All, 

I'm on a tight deadline so thought I'd throw this out there. I have a
problem in IE6, from BrowserCam it looks like the right column with the
main content is dropping. 

http://tinyurl.com/c9ybfs 

This doesn't seem to be happening on some of the other pages but don't
think there's a difference in the relevant css/html, e.g. in BC this
looks OK (apart from the PNGs!): 

http://tinyurl.com/avn5at

Any ideas? Thanks, 

-Nigel 

__
css-discuss [cs...@lists.css-discuss.org]
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] Site check please

[Duckworth, Nigel]

No flyout in IE6. 

I'll be in the Cape in June, will have to check out Tulbagh. 

-Nigel 


-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Bill Stemp
Sent: Friday, February 08, 2008 2:41 AM
To: Ingo
Cc: CSS Discussion
Subject: Re: [css-d] Site check please


Since building the site, I've upgraded my IE from 6 to 7. I now have to 
use 'multipleIEs' 
(http://www.positioniseverything.net/articles/multiIE.html) to check in 
previous versions. When the site was first uploaded, it worked fine in 
IE6 (with the exception of the orange menu background being a few pixels

below where it should be), but now I'm getting these reports that there 
is no 'flyout' of the menu in IE6. I also found the same using my 
standalone IE6 but thought this was just one of those things that 
doesn't work 100% using these 'standalone' versions.
If anyone has not upgraded to IE7 and is using IE6 as their primary IE 
browser, I'd be very interested to know if the menu does in fact 
'flyout' or not.

Bill

Ingo wrote:
> Bill Stemp schrieb am 07.02.2008 14:33
>
>> http://www.pielows.co.za/
>>
>> I'm particularly interested in how one section of the site appears in
>> IE6 (or before). This section is accessed with the menu link '_*Cape 
>> Tours*_' and has a CSS-driven menu on the left. I think that this 
>> menu's background is not correctly aligned in IE6, but cannot be
sure.
>
> No hover, no flyout with IE6 here.
>
>
> Gr ingo
>
__
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] How do you kill the cell spacing in table with CSS?

[Duckworth, Nigel]

> I have an example at http://www.omgma.com/
> Under the third menu tab in the center of the page 
> - where it says Program Schedule (Below the "What's New") 
> I have a table.

> I tried using border-collapse - but I am still getting 
> spacing between the cells.  What is the CSS to get rid 
> of the spacing between table cells?

You need to apply the border-collapse to TABLE (not the TD) then you can
apply your borders to TD, something like this: 

table#sessions { 
padding:  5px !important; 
margin: 0 !important;
border-collapse: collapse !important; 
border-spacing: 0 !important;
}

table#sessions td { border: 1px solid #092845; } 


Best, 

-Nigel 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-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] Validator is whack

[Duckworth, Nigel]

>>

I don´t get this validator. Anyway I am trying to validate my document and I 
can´t get it to work. I have three stuborn errors which I can´t work out.
  
http://validator.w3.org/check?uri=http%3A%2F%2F216.219.94.105%2Findex1.cfm&charset=%28detect+automatically%29&doctype=Inline
  
>>

You have a meta tag before you html opening tag; a script between the closing 
HEAD but before the opening BODY tag. You also have unquoted attributes in your 
code: . 

Regards, 

Nigel 



__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-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] FW: Unwanted underlines on text (not links) in FF

[Duckworth, Nigel]

> Interesting that the HTML validator treats that as valid:
 
Yep. But according to the HTML 4 spec it's required. It's the age old
question: Who will validate the validator? 
 
Best, 
 
Nigel 
 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-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] FW: Unwanted underlines on text (not links) in FF

[Duckworth, Nigel]

> All my *text* (not just links) is underlined on 
> mouseover in FF 1.5.0. This is not happening in 
> IE 7. The site where this is happening can be found 
> here: http://www.ischool.berkeley.edu/~allisonb/OHA/ 
> And the stylesheet is here:
http://www.ischool.berkeley.edu/~allisonb/OHA/stylesheets/styles.css


You have an unclosed : 

   
   OHA provides ... commitment.

It needs an explicit closing tag. Change it to . 

Regards, 

Nigel 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-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] Gap in box

[Duckworth, Nigel]

> HTML
> http://www.arnoenzerink.com/modeling/altia2004.shtml
> CSS
> http://www.arnoenzerink.com/styles/modeling.css

... 

> The image is in #imagebox I haven't set the height 
> of the box, nor any padding. Yet there is a gap 
> at the bottom of the box inside the frame.

Add: 

img { display: block; }

Regards, 

Nigel 


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

Re: [css-d] floats inside a div

[Duckworth, Nigel]

> http://www.redroosterweb.com/floats.html

> How do I, or can I make a container div actually 
> contain a other floated divs and it's height is 
> determined by the contents of the divs contained 
> within it.

Float it. 

For details see our esteemed moderator's article: 
http://www.complexspiral.com/publications/containing-floats/

Regards, 

Nigel 

...

Nigel M. Duckworth
One Network Enterprises
www.onenetwork.com


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

Re: [css-d] Background Image on Blockquote Hidden Under Floated Image

[Duckworth, Nigel]

David, 

Great, thanks for checking it out! 

Regards, 

Nigel


-Original Message-
From: David Laakso [mailto:[EMAIL PROTECTED] 
Sent: Monday, June 19, 2006 2:03 AM
To: Duckworth, Nigel
Cc: [EMAIL PROTECTED]; Els; css list list
Subject: Re: [css-d] Background Image on Blockquote Hidden Under Floated
Image


Duckworth, Nigel wrote:
> Franky,
>
> I like your mutations! I will take a closer look at this tonight and 
> if the markup changes aren't to radical I might go with this, in any 
> case it's nice to have choice.
> -Nigel
> See testpage over here 
> <http://home.tiscali.nl/developerscorner/css-discuss/test-acme.htm>.
> Comments are inside src code.
> Tested only in IE6, Opera7.54, Opera8.01 and FF1.07.
> francky
offlist:
As a fan of hackless solutions, she's looking good and standing tall 
here in:
xp
1] Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.4) 
Gecko/20060516 SeaMonkey/1.0.2
2]Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.0.4) 
Gecko/20060508 Firefox/1.5.0.4
3]Opera9.0b2
Best,
~dL

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

Re: [css-d] Background Image on Blockquote Hidden Under Floated Image

[Duckworth, Nigel]

Franky, 

I like your mutations! I will take a closer look at this tonight and if
the markup changes aren't to radical I might go with this, in any case
it's nice to have choice.  

Thanks for your input - much appreciated! 

Regards, 

-Nigel


-Original Message-
From: francky [mailto:[EMAIL PROTECTED] 
Sent: Sunday, June 18, 2006 5:17 AM
To: Els
Cc: Duckworth, Nigel; css list list
Subject: Re: [css-d] Background Image on Blockquote Hidden Under Floated
Image


Els wrote:

>[...]
>If you give blockquote overflow:hidden or overflow:auto, the
>problem is solved in Firefox and Opera.
>If you give blockquote a height, the problem is solved in IE.
>Use hacks to hide the overflow from IE and the height from 
>Firefox :-)
>
>Tested only in IE6, Opera 8.54 and FF1.5.
>  
>
Hi and good morning (anyway for Els it's morning),
In the meantime I was playing with a hackless solution, by making a 
sidebar-div and a content-div.
See testpage over here 
<http://home.tiscali.nl/developerscorner/css-discuss/test-acme.htm>.
Comments are inside src code.
Tested only in IE6, Opera7.54, Opera8.01 and FF1.07.

Greetings,
francky

oh, all test results: positive ;-)



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

Re: [css-d] Background Image on Blockquote Hidden Under Floated Image

[Duckworth, Nigel]

Els, 

Fantastic, thank you! I should have thought of trying overflow: hidden,
I tried everything and the kitchen sink but that. This would be ideal
since I don't have to change the markup (which I don't have control of).


Regards, 

-Nigel

-Original Message-
From: Els [mailto:[EMAIL PROTECTED] 
Sent: Sunday, June 18, 2006 3:31 AM
To: Duckworth, Nigel; css list list
Subject: Re: [css-d] Background Image on Blockquote Hidden Under Floated
Image


Duckworth, Nigel wrote:
> Greetings All,

Hi,

> I'm working on a page which contains posts with an author image 
> floated left, the text of the post down the right and wraps around the

> image. A problem occurs when there are blockquotes in the post. The 
> blockquote has a background image quote mark and it disappears under 
> the floated image. A similar thing is happening with DIV.hb, it's 
> background image disappears but only in Firefox. Some posts will have 
> the floated image while others will not, so I have to take into
> account both scenarios.

[snip]

> Markup with CSS here:
> http://newcleardesigns.com/lab/

If you give blockquote overflow:hidden or overflow:auto, the 
problem is solved in Firefox and Opera.
If you give blockquote a height, the problem is solved in IE. Use hacks
to hide the overflow from IE and the height from 
Firefox :-)

Tested only in IE6, Opera 8.54 and FF1.5.

-- 
Els
http://locusmeus.com/
http://locusoptimus.com/ 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-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 Image on Blockquote Hidden Under Floated Image

[Duckworth, Nigel]

Greetings All,  

I'm working on a page which contains posts with an author image floated
left, the text of the post down the right and wraps around the image. A
problem occurs when there are blockquotes in the post. The blockquote
has a background image quote mark and it disappears under the floated
image. A similar thing is happening with DIV.hb, it's background image
disappears but only in Firefox. Some posts will have the floated image
while others will not, so I have to take into account both scenarios. 

I found a similar issue in the archives regarding lists, bullets are
hidden under the floated images. The only workaround was to add a big
margin-right to the floated image but that didn't work and would be
unacceptable anyway.  

Questions: Is this the proper behavior, that only the text wraps around
the image, borders and backgrounds ignore the float? Any way to work
around this? I'm thinking I will have to move those images into the
markup -- but that's a problem as the web page is generated
automatically by a program and I want to avoid messing with that if
possible.  

Markup with CSS here: 
http://newcleardesigns.com/lab/

I'd appreciate any suggestions! 

Regards, 

Nigel

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

Re: [css-d] Right Navigation Pane in Liquid Layout is not behavingproperly

[Duckworth, Nigel]

Your right column looks fine (FF1.5), it's your background image on that
column - it's only 150px wide.

Nigel


-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Chris C
Sent: Monday, May 08, 2006 9:31 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] Right Navigation Pane in Liquid Layout is not
behavingproperly


>From reading posts and help you guys helped others with; I resolved my
left menu bar navigation problem by implementing the liquid columns
(based on this site http://www.alistapart.com/articles/negativemargins/)

But the problem I'm having is that I can't get my right column to be
un-proportional to the left column.

This is what I want:
<-- 150px --><-- Xpx (defined by browser window) --><-- 280px -->

But what I'm getting is:
<-- 150px --><-- Xpx (defined by browser window) --><-- 150px -->

Here is the link: http://hitech.lead2gold.org

I'm new to css, so I'm basing what is happening on the background colors
within the right column. Thus that is what I want to adjust.  I have set
all the right column information to 280px, and the calendar is being
placed properly.  I just can't get the background to behave as the
calendar does.

Chris

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-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
IE7b2 testing hub -- http://css-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] changing bullet point colours

[Duckworth, Nigel]

> Has anyone found a way of changing bullet 
> point colours to a different colour to the text?

Dave, try this:

CSS

li { color: #C00; }
li span { color: #0C0; }


HTML


List Item One



Regards, 

Nigel





__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-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
IE7b2 testing hub -- http://css-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] Including List Bullets Inside Links

[Duckworth, Nigel]

Les Mizzell:
"I'm using an image for bullets on a list of links.
Client want you to be able to click the bullet as well as the link."

To make the bullet "clickable" I would put the bullet on the background
of the link and pad that area to give the bullet space, like so: 


Link 1
...


.bulleted { list-style: none; }
.bulleted a { padding-left: 25px; background: url(/icons/bullet.gif) 0%
50% no-repeat; }

Should work. 

-Nigel

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-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 crash on Windows XP

[Duckworth, Nigel]

James, 

I'd start by fixing these: 

line 1 column 1 - Warning: missing  declaration
line 49 column 15 - Warning: missing  before 
line 49 column 217 - Warning: discarding unexpected 
line 67 column 1 - Warning: discarding unexpected 

Best, 

-Nigel



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

Re: [css-d] Strange position of list bullet/image in IE, please help

[Duckworth, Nigel]

> I'm trying to restyle a page and I'm running into something very 
> strange: the bullet of an LI is moved down in IE as if it is
vertically 
> centered for the enclosed UL.
> 
> Here you can see it (last option in the left column).
> 
>
http://web.inter.nl.net/users/hepabolu/cocoondocsskin/samples/sample.htm
l


Helma, 

Try putting styling the bullet as a background on the LI, better
cross-browser consistency. 

http://css.maxdesign.com.au/listamatic/vertical05.htm

-Nigel
 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-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] Padding/Margin problem - different in IE6 and Firefox

[Duckworth, Nigel]

JJ wrote:
---
http://fortcollinsincubator.org

The problem is that in Firefox the first few items within the page are 
pushed right, as if they have added padding.  This effect goes away down

the page, seemingly at a random point, like in the middle of a
paragraph, 
then the rest of the page is OK.  In IE6 I get a consistent margin down 
the entire page, but it's also too far to the right.
---

Add this to #nav to see what's happening: 

border: 1px solid #F00;

Only took a quick look but it looks like #nav is too wide and pushing in
to the main content area. Adjust its width and padding accordingly.
Remember padding is in addition to specified width, so as your code
stands, the width of #nav is 175px + 34px = 209px. If you want a width
of 209px on the nav, increase the margin on your content. 

Personally, I'd take the padding off #nav and apply it to the elements
within #nav. 

-Nigel



nigel m. duckworth | one network enterprises 
6101 Carnegie Blvd, Charlotte, NC 28209
704.227.1991 T   704.227.1901 F
[EMAIL PROTECTED] | www.onenetwork.com
  

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

Re: [css-d] css & fonts

[Duckworth, Nigel]

Nic said:

> I think what was meant is that the creator of the site has specified
1em to be equivalent to 10px.

Exactly, the 1em is *relative* to 10px.   

-Nigel


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

Re: [css-d] css & fonts

[Duckworth, Nigel]

Ian said: 
> But why does 1em Verdana look so small? 

The 1em is relative to 10px. 

-Nigel



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

Re: [css-d] Cederholm Styling with IDs - IE Misbehaving

[Duckworth, Nigel]

Mary, 

> The stylesheet is here:
http://www.byronsbyte.com/bernard/css/layout.css

I don't know if this is causing any problems but your clear has an
invalid value, "all" instead of "both": 

#clear /* for any column longest setting - clears the colWrapper that
contains the divs */
{
width:100%;
height:6%;
/*height:1px;  ie workaround */
clear:all; /* clear: all; */
background:#2a8fba;
border-top:1px solid #ccc;
border-bottom:3px solid #000; /* faux bottom */
}

Regards, 

-Nigel

nigel m. duckworth | one network enterprises 
6101 Carnegie Blvd, Charlotte, NC 28209
704.227.1991 T   704.227.1901 F
[EMAIL PROTECTED] | www.onenetwork.com



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

Re: [css-d] 2 Column layout + equal height problem

[Duckworth, Nigel]

> If you are up for starting from scratch, try the 2 col layout 
> on this page: 
> It will walk you through the faux col business. And it is a 
> very stable robust layoutIf you prefer a fixed width 
> layout, simply wrap it in a giant wrapper with a fixed width 
> assigned to it.

You can save a div by moving #wrapper outside of the banner and footer
and setting the width on that.  

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

RE: [css-d] New article on PIE - "In Search of the One True Layout"

[Duckworth, Nigel]

> well, except for the client that wants to be able to copy and paste 
> content from their site into whatever they want to use it in... it's 
> quite common for folks to copy/paste something, from an address to
phone 
> number to entire paragraphs...and use it in other media, don't you
think?

Darn, my marketing spin/joke fell totally flat. Guess it's the way I
tell 'em.

I agree, it's definitely a problem, but thanks to Ingo there's a fix. 

Nigel


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

RE: [css-d] New article on PIE - "In Search of the One True Layout"

[Duckworth, Nigel]

> Suggestion for a fix: remove the position: relative in .wrapper h2

Ingo's fix worked for me FF 1.0.4 on XP.

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

RE: [css-d] New article on PIE - "In Search of the One True Layout"

[Duckworth, Nigel]

Yep, exactly as Donna described. But...I can also make everything
disappear by clicking on the little square box in the top right with the
[x] in it. ;) Seriously though, who does this (besides us)? And is this
"problem" unique to this method? I suppose someone wanting to nick your
copy would do this - nice anti-theft device Alex!

Regards,

-Nigel


-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Donna Casey
Sent: Wednesday, October 26, 2005 12:06 PM
To: Alex Robinson
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] New article on PIE - "In Search of the One True
Layout"


http://www.positioniseverything.net/articles/onetruelayout

Alex Robinson wrote:

> This doesn't happen for me. It's very difficult to select any of the
> text, but the results you see just don't occur at my end. What
platform 
> are you on? I'm runnning OS X.


I am running Windows XP Pro SP2 with Firefox 1.07. Are you saying you 
didn't test this on Windows?

I can reproduce it consistently, and make nearly all the boxes disappear

simply by inserting my cursor at the beginning of any heading and 
dragging through the content past the bottom of the box. If I keep 
dragging downward, I can make all of the boxes (except the purple one) 
scroll upward and off screen.

1)http://www.positioniseverything.net/articles/onetruelayout/example/rou
nded

2) insert cursor just before text "Block2" in the green inner box

3) keeping your cursor pressed, drag downward (don't worry that you 
don't see the content being selected...that's another bug, I guess) but 
keep dragging past the bottom of the box

Results: the boxes, corners and contents scroll upward, disappearing 
eventually.

4) now insert the cursor in the next row's heading and repeat. These 
will scroll away, too, same for the third row's boxes

Basically, it doesn't matter which heading you start with...a row of 
boxes scrolls away, if you keep dragging. It's possible to end up with 
only the purple right-hand box and its top corners and content go 
missing

As well, you cannot get the boxes back by reloading the page or hitting 
back button and returning, though you can click the example link on :

http://www.positioniseverything.net/articles/onetruelayout/examples

(round corners example) and that will bring back the boxes.

Anyone else, since Alex needs confirmation?

Donna Casey



__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

RE: [css-d] Why add an .img class?

[Duckworth, Nigel]

Charles D: 
>> #sweden dd.img img {float: left;}
>>
>> I didn't see the point of adding the class to the html code because
it 
>> seemed to me that it could be identified without it, so I
experimented 
>> by leaving out the class and addressing it in the CSS with just
>>

Christian M:
>It's just that you never know when you might have a dd with an image
that you don't want to float. So it's good to give all particular dd's 
>with imgs you want to float their own class.

It has to do with alternating the direction of the floated image and
overriding the margins on the dd which are set for the dd.alt class
later on in the stylesheet. Charles, read on...pp 100-101 explains. 

-Nigel


-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Christian
Montoya
Sent: Tuesday, October 18, 2005 9:19 AM
To: Charles Dort
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] Why add an .img class?


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

RE: [css-d] CSS and standards Podcasts

[Duckworth, Nigel]

Paul Boag (www.boagworld.com) has a great weekly podcast on web design.
The show is not exclusively devoted to css and standards, but he's
definitely an advocate. 

Nigel


-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of [EMAIL PROTECTED]
Sent: Wednesday, October 05, 2005 5:51 PM
To: css-d@lists.css-discuss.org
Subject: [css-d] CSS and standards Podcasts


Hello Everyone,

I have downloaded some great podcasts on Odeo.com feauring ou own Eric 
Meyers and other speaking on CSS and web standards.

I was wondering if anyone else knows of other podcasts on similiar 
topics.

Seeing more of these topics pop up to listent to has convinced me to 
buy my first ipod (Nano).
I apologize if this is an off the list topic, but I think some of the 
subjects talked about (especially the CSS prototyping and processes 
Eric discussed) are an incredible resource for all involved to hear.
Please let me know if there anymore out there that someone knows of 
(design related to!).

A.H.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

RE: [css-d] Unstable footer in IE

[Duckworth, Nigel]

> I put together this page: 
> http://www.myrenewell.com/balancesheet/2005/August 
> and am having trouble with the footer.  

Look at the output source of your page. It has severe structural
problems - the content div has another document in it, including header
and body tags [see below]. You need to sort that out before anything
else. I also think you're overdivving.

-Nigel

---



  
...
  

  


...
...




Welcome to myRenewell 


 
...

 







   

...
...   








  

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

RE: [css-d] Unwanted Wrapping of Graphics in IE5.x Win

[Duckworth, Nigel]

Thanks Georg! That worked for IE5.0 and 5.5! 
 
What is this bug? It's not the 3 pixel jog is it? I want to look into it a bit 
more - surprised I haven't encountered it before. 
 
Thanks again,
 
-Nigel 

-Original Message- 
From: Gunlaug Sørtun [mailto:[EMAIL PROTECTED] 
Sent: Thu 9/15/2005 7:44 PM 
    To: Duckworth, Nigel 
Cc: css-d@lists.css-discuss.org 
Subject: Re: [css-d] Unwanted Wrapping of Graphics in IE5.x Win



    Duckworth, Nigel wrote:
> In my simplified test case I have 2 graphics in a div, first floats
> left, second floats right. Looks fine in most browsers except for Win
>  IE5.

> http://nigelduckworth.com/test/one/test_ie5.html

'IE5.0 only' corrections:
#banner {width: 704px;
background: transparent;
}
img#logo {
margin-right: -6px;
}
...should compensate for box-model and other problems. Not sure if the
values are correct for IE5.5 since I don't have that version.

regards
Georg
--
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/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Unwanted Wrapping of Graphics in IE5.x Win

[Duckworth, Nigel]

In my simplified test case I have 2 graphics in a div, first floats
left, second floats right. Looks fine in most browsers except for Win
IE5. I tried display inline (double margin float bug) and setting
heights, removing white space from the html and a few other things but
nothing worked. Any help greatly appreciated. 

HTML


  


  



CSS [main]

#wrapper { margin: 0 auto; width:698px; }
#banner { width: 698px; height: 200px; background: #2C2B60; } 
#logo { float: left; }
#bannergfx { float: right; }

CSS [ie5 hacks]

body { text-align: center; }
#wrapper { text-align: left; }


Full css and test case are here:

http://nigelduckworth.com/test/one/test_ie5.html

Thanks in advance,

Nigel


nigel m. duckworth | one network enterprises 
6101 Carnegie Blvd, Charlotte, NC 28209
704.227.1991 T   704.227.1901 F
[EMAIL PROTECTED] | www.onenetwork.com
 
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

RE: [css-d] dotted underline

[Duckworth, Nigel]

.underline { border-bottom: dotted 1px #66; }



Please underline me.

-Nigel

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

RE: [css-d] What is "transparent url"

[Duckworth, Nigel]

> background: transparent url(filename).

That's shorthand. Transparent is the background color, the url is the
path to the background image. In longhand it's:

background-color: transparent;
background-image: url(filename);

-Nigel



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

RE: [css-d] CMS question

[Duckworth, Nigel]

Jeff, 

Here's a good place to start: 

http://css-discuss.incutio.com/?page=CssFriendlyCms

-Nigel

-Original Message-
From: Jeff Cortez [mailto:[EMAIL PROTECTED] 
Sent: Wednesday, June 15, 2005 5:27 PM
To: css-d@lists.css-discuss.org
Subject: [css-d] CMS question


Hi all,

I'm a newbie and slowly learning CSS.  I'm slowly seeing how beneficial
it is to design for standards.

Anyways, I had a quick question to pose to people:  Has anyone had any
experience with an open source content management system and implemented
standards compliant code along with it?  Looking for
comments/suggestions/rants/raves...

Thanks in advance...


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

RE: [css-d] Can someone explain this to me

[Duckworth, Nigel]

Your css (#nav li li) will only apply to a nested list, i.e.:


 
  ...
 


If you want to style only the second  item you'd have to put a class
on it:

test line 1
line 2

-Nigel

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

RE: [css-d] sliding doors and bottom margin/padding?

[Duckworth, Nigel]

Remove the whitespace from between the  e.g.:

.. and so on

or you can comment out the space: 

..

-Nigel

-Original Message-
I'm using A List Apart's Sliding Doors technique for my navigation,  
but I'm having trouble in ie6 where there is a gap below the navigation.
It works fine in Firefox and Safari. http://www.saturnflyer.com/insinga/

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

RE: [css-d] aligning li items

[Duckworth, Nigel]

> Is there a way to decorate DLs that makes it look like a list?
Sure, use a background image of a bullet on the dt.

-Nigel

-Original Message-
From: Keith Sader [mailto:[EMAIL PROTECTED] 
Sent: Wednesday, May 18, 2005 3:03 PM
To: css-d@lists.css-discuss.org
Subject: Re: [css-d] aligning li items


We're trying both.

The DL makes more sense to me, but we need the bullet decorations.  Is
there a way to decorate DLs that makes it look like a list?

thanks to everyone who's helped so far!

On 5/18/05, Duckworth, Nigel <[EMAIL PROTECTED]> wrote:
> Keith,
> 
> Do you have to use ? It makes more sense to use , something 
> like
> this:
> 
> 
> dl { width: 440px; }
> dt { float: left; width: 100px; text-align: right; clear: both; } dd {

> float: right; width: 300px } 
> 
> term 1 -
> Term 1 is the very first term in the list. 
> term 2 -
> Term 2 is the second term in this definition list.
> term 3 -
> Term 3 is the third term in this fairly long definition
> list. 
> 
> 
> -Nigel
> 
> 
> -Original Message-
> From: Keith Sader [mailto:[EMAIL PROTECTED]
> Sent: Wednesday, May 18, 2005 11:08 AM
> To: css-d@lists.css-discuss.org
> Subject: [css-d] aligning li items
> 
> Greetings.
> 
> We've got a requirement to align some li items.
> 
> The list items are basically expaining acronyms.
> 
> ABC- Alpha Beta Charlie
> DFQG  - Delta Fox Quarrel Gamma
> 
> However the alignment requirement is such that the acronym 
> explanations are all lined up at the dashes.
> 
> I've thought of structuring the html like this:
> 
> ABC- Alpha...
> DFQG- DFQG...
> 
> then adding the following style
> 
> li span {
>width: 200px;
> }
> 
> but this doesn't give me a 'default' box area to keep the acronyms in.

> Any suggestions?  I've looked at list-o-matic and I don't see anything

> that does this.
> 
> thanks,
> --
> Keith Sader
> [EMAIL PROTECTED] http://www.saderfamily.org/roller/page/ksader
> __
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
> 


-- 
Keith Sader
[EMAIL PROTECTED]
http://www.saderfamily.org/roller/page/ksader
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

RE: [css-d] aligning li items

[Duckworth, Nigel]

Keith, 

Do you have to use ? It makes more sense to use , something like
this: 


dl { width: 440px; }
dt { float: left; width: 100px; text-align: right; clear: both; }
dd { float: right; width: 300px }


term 1 -
Term 1 is the very first term in the list. 
term 2 -
Term 2 is the second term in this definition list.
term 3 -
Term 3 is the third term in this fairly long definition
list. 


-Nigel



-Original Message-
From: Keith Sader [mailto:[EMAIL PROTECTED] 
Sent: Wednesday, May 18, 2005 11:08 AM
To: css-d@lists.css-discuss.org
Subject: [css-d] aligning li items


Greetings.

We've got a requirement to align some li items.

The list items are basically expaining acronyms.

ABC- Alpha Beta Charlie
DFQG  - Delta Fox Quarrel Gamma

However the alignment requirement is such that the acronym explanations
are all lined up at the dashes.

I've thought of structuring the html like this:

ABC- Alpha...
DFQG- DFQG...

then adding the following style

li span {
   width: 200px;
}

but this doesn't give me a 'default' box area to keep the acronyms in.
Any suggestions?  I've looked at list-o-matic and I don't see anything
that does this.

thanks,
-- 
Keith Sader
[EMAIL PROTECTED]
http://www.saderfamily.org/roller/page/ksader
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
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
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/