Re: [css-d] Which selector to use?

[Philippe Wittenbergh]

On Mar 31, 2010, at 3:12 AM, Linda Miller, DVM wrote:

> I was using the #closeButton selector and just changing the font size.  This 
> did not work as expected and I should have checked it in other browsers 
> before posting. Since it was not working correctly in Safari, I thought that 
> it was my CSS rather than the browser.


When no other styles are applied to the button (or any other form control, ftm) 
Safari will size the text (font-size) based on a set of predefined steps 
(mimicking the OS). Try setting input[type="button"] {font-size:4em"} as a 
test. You will see a difference. 

Philippe
---
Philippe Wittenbergh
http://l-c-n.com/





__
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] More new to css questions

[Climis, Tim]

-Original Message-
From: css-d-boun...@lists.css-discuss.org 
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Lineberger, Scott
Sent: Tuesday, March 30, 2010 4:21 PM
To: 'css-d@lists.css-discuss.org'
Subject: [css-d] More new to css questions

Ok,

I am beginning to warm up to using div's, but perhaps I am being impatient.  I 
was using tables to line up 4 "sections" horizontally, with sections 2, 3, and 
4, each containing a form.  How do you do that with div?

Check this out for a good laugh (or cry?)...

http://www.coastalind.com/test2.html

1.  As Bill and MB have been shooting back and forth all day, beware of 
divitis.  You've got a bad case of it right here.  If there's only one thing in 
your div, there's a 99% chance that the div is unnecessary.  For example, the 
ones around your forms can all be thrown away without a backward glance.

2. To answer the question at hand, there's lots of ways.  The most common is 
floats, but you could also use absolute positioning, or display:table.

Going with floats though, as those are the most straightforward, these make 
things beneath them float up the page.

In your case, for example, after I got rid of those divs, I would put in a rule 
that's something like this:

form {
  width: 22%;
  margin: 1em;
  float: left;
}

That will make all your forms 22% of the page width, give them a nice margin so 
they aren't running into each other, and then make them float up next to each 
other.

I'm pressed for time at the moment, so I'll leave you with that, but I might 
add more later tonight.

---Tim
__
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] More new to css questions

[Lineberger, Scott]

Ok,

I am beginning to warm up to using div's, but perhaps I am being impatient.  I 
was using tables to line up 4 "sections" horizontally, with sections 2, 3, and 
4, each containing a form.  How do you do that with div?

Check this out for a good laugh (or cry?)...

http://www.coastalind.com/test2.html

Scott


__
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] New to css

[Bill Braun]

MB wrote:
> Bill Braun said:
>   
>> Your interpretation is a bit on the literal side, but I am grateful for 
>> your kind words nevertheless.
>> 
>
> My apologies. I forgot the smiley. Digital communication can be
> difficult when writing on the run.
>   

I've impaled myself on that hook a time or two...

Bill B


__
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] New to css

[MB]

Bill Braun said:

>Your interpretation is a bit on the literal side, but I am grateful for 
>your kind words nevertheless.

My apologies. I forgot the smiley. Digital communication can be
difficult when writing on the run.


__
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] Which selector to use?

[Linda Miller, DVM]

>what were you trying to do?
Change the font size of the close button that has this 

>what was the problem? you never explained what was happening.

It did not display as expected (increased font size) in Safari on the Mac but 
does in FireFox and Mobile Safari.

#closeButton {
font-size:2em;
}

I thought that is what I said when I wrote this:
>I was using the #closeButton selector and just changing the font size. 

>were you selecting it wrong? 

No.

I did not post it to a web site  and send the URL because I was just checking 
it on my desktop.  Now I know that the selector was being used correctly but it 
was just the browser (Safari on the Mac) that was not displaying it as expected.

I should have tested in more browsers before posting to the list.  

Linda


__
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] Which selector to use?

[jeffrey morin]

On Tue, Mar 30, 2010 at 2:12 PM, Linda Miller, DVM wrote:

> Thank you, Kata.  My problem apparently was that I was testing in Safari on
> the Mac.  I was using the #closeButton selector and just changing the font
> size.  This did not work as expected and I should have checked it in other
> browsers before posting. Since it was not working correctly in Safari, I
> thought that it was my CSS rather than the browser.
>
> Linda
>
> what was the problem? you never explained what was happening. were you
selecting it wrong? what were you trying to do?

Jeff
__
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] Which selector to use?

[Linda Miller, DVM]

Thank you, Kata.  My problem apparently was that I was testing in Safari on the 
Mac.  I was using the #closeButton selector and just changing the font size.  
This did not work as expected and I should have checked it in other browsers 
before posting. Since it was not working correctly in Safari, I thought that it 
was my CSS rather than the browser.

Linda
__
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] Which selector to use?

[Krupa Anna Katalin]

Linda Miller, DVM wrote:
> I would like to style an input button
>
> 
>
> What selector would I use to do this?
>
> There are other buttons that I do not want to style the same as this 
> button.
Hi, i use the following for not ie6 browsers:
input[type="submit"] {
anything: you_want;
}

and use this for ie6:
input {
border: expression(this.type=='submit' ? '1px solid #000' : 'none');
}

In the expression you can recognize the type of the input field.
But you must add "border" for other input fields too.
So in the above expressen I give '1px solid #000' border for any submit 
field on the page,
and 'none' for any other input field, but you can write this also:
input {
border: expression(this.type=='submit' || this.type=='text' ? '1px 
solid #000' : 'none');
}
in this case any submit and text fields get '1px solid #000' border and 
anything else get 'none'
This is javascript in css, but is works only in ie.
But I just use it in ie6, anywhere else it not needed and if you can, 
avoid to using these.
The explanation is why: 
http://developer.yahoo.net/blog/archives/2007/07/high_performanc_6.html
But if you don't use many of these expressions, I think you can use it. 
I do :)

Or the other solution is you can add class for any submit field.
Or you can write javascript to window.onload function.


Kata

__
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] New to css

[Bill Braun]

Ed Seedhouse wrote:
> And I close with a recommendation to read the links provided by Bill.
>   
Credit goes to MB for the links.

Bill B


__
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] New to css

[Bill Braun]

MB wrote:
> Bill Braun said:
>   
>> Setting aside the moral implications, having made a transition from a 
>> site built completely around tables to one based on , the latter, 
>> in my experience and opinion, takes much better advantage of CSS. I have 
>> been able to do everything using  as I did using , in a much 
>> more flexible manner, and, again in my opinion, with a slight edge in 
>> favor of design aesthetics.
>> 
>
> Based on "divs"? Hello? What about "based on structural semantic markup
> and CSS-layout techniques"?
>
> You guys - Bill, Claude - sound like you have contracted divitis* in
> your migration to CSS-layout techniques. Better find a cure.
>   

Your interpretation is a bit on the literal side, but I am grateful for 
your kind words nevertheless.

Bill B

__
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] Problems with IE6 - update

[Joe Jackson]

This is the code that fixed it

/*end global nav*/
/* for IE5.5 and IE6 only */
 #globalnav {
   position: relative;
   z-index: 2;
}
.home-main-text-wrapper {
   z-index: 1;
}
/***

On Tue, Mar 30, 2010 at 5:28 PM,  wrote:

> So, what fixed it???
>
> - Original Message - From: "Joe Jackson"  >
> To: 
> Sent: Tuesday, March 30, 2010 8:19 AM
> Subject: Re: [css-d] Problems with IE6 - update
>
>
>
> Sorry all, its working now
>>
>> Thanks for all your help! much appreciated
>>
>
__
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] New to css

[Ed Seedhouse]

There is nothing evil about tables, which are a part of html and as
such serve the purpose of marking up tabular content.  If the content
is naturally tabular, then it is wrong to mark it up other than with a
table.

Yes, it is wrong to use tables to create a layout, but not to use them
when appropriate is equally mistaken.

As Bill said, what HTML should be all about is the semantics of the
content.  That is what it is designed for, and was right from the
start.  Use HTML to mark up the meaning of the content, and CSS to
modify it's presentation.

Abuse of DIVs simply for layout is just as wrong as abusing tables for
the same purpose.  If you think there is a debate about "divs vs.
tables" you just simply don't get it.

And I close with a recommendation to read the links provided by Bill.

-- 
Ed Seedhouse
__
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] Which selector to use?

[Jukka K. Korpela]

Linda Miller, DVM wrote:

> Sorry. I should have checked this first.

Checked what?

> It must have been the browser that I was using Safari 4.0.4 on the 
> Mac.

No, I think it's on line 42 of your code. A wild guess, but it _might_ be 
true, whereas your guess is most probably wrong, as you seem to suggest that 
the simple selector

> #closeButton

does not work on a particular browser. Browsers have buggy CSS support, but 
hardly that buggy. The odds are that the browser recognized your selector 
but had issued with your CSS declarations. So you probably still have the 
original problem.

Specifically, browsers often have limitations and bugs in formatting form 
fields, like a button. This normally has nothing to do with the selector 
used to "pick up" the field.

As usual, a URL would be worth a thousand words.

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/ 

__
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] Which selector to use?

[Linda Miller, DVM]

Sorry. I should have checked this first. It must have been the browser that I 
was using Safari 4.0.4 on the Mac. I just tried it in Firefox and it works 
fine.

Linda
On Mar 30, 2010, at 10:42 AM, Philip TAYLOR wrote:

#closeButton ?

Linda Miller, DVM wrote:
> I would like to style an input button
> 
> 
> 
> What selector would I use to do this?
> 
> There are other buttons that I do not want to style the same as this button.
> 
> Thank you,
> Linda
__
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] Which selector to use?

[Philip TAYLOR]

#closeButton ?

Linda Miller, DVM wrote:
> I would like to style an input button
>
> 
>
> What selector would I use to do this?
>
> There are other buttons that I do not want to style the same as this button.
>
> Thank you,
> Linda
__
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] Reset CSS

[David Laakso]

Chris Blake wrote:
>
> Anyone know of a standard and simple reset.css file to use.
>
>
> Thanks, CB
>   

Code without using using a reset,css file. You'll learn what you are 
doing and why you are doing it. Your css file will be light, lean, mean, 
and will load fast. It will be easy to maintain the file in the future. 
People from around the world will come to you not only to seek your 
advice but to heap monetary rewards upon you.

Best,
~d





-- 
desktop
http://chelseacreekstudio.com/
mobile
http://chelseacreekstudio.mobi/

__
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] Which selector to use?

[Linda Miller, DVM]

I would like to style an input button



What selector would I use to do this? 

There are other buttons that I do not want to style the same as this button.

Thank you,
Linda


__
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] Reset CSS

[Skip Knox]

David, do you happen to have a list of those available CSS frameworks you
went through? It might be of interest to several of us here.


Skip Knox
Boise State University


But, yes. I think the general idea is you should "roll your own."
> FWIW I went through all available "CSS frameworks" last year to come up
> with mine. It has saved me oodles of time and effort since...
>
> Cordially,
> David
> --
>
>
__
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] Problems with IE6 - update

[russ]

So, what fixed it???

- Original Message - 
From: "Joe Jackson" 
To: 
Sent: Tuesday, March 30, 2010 8:19 AM
Subject: Re: [css-d] Problems with IE6 - update


> Sorry all, its working now
> 
> Thanks for all your help! much appreciated
__
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] Problems with IE6 - update

[Joe Jackson]

Sorry all, its working now

Thanks for all your help! much appreciated

On Tue, Mar 30, 2010 at 4:09 PM, Joe Jackson wrote:

> Hi
>
> I have just tried the following which is working in IE8 but in IE6 the drop
> down menu is still showing behind the main image?
>
> /*end global nav*/
> /* for IE5.5 and IE6 only */
>  #globalnav {
>position: relative;
>z-index: 2;
> }
> .home-main-text-wrapper {
>z-index: 1;
> }
>
> /***
>
>
__
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] Problems with IE6 - update

[Joe Jackson]

Hi

I have just tried the following which is working in IE8 but in IE6 the drop
down menu is still showing behind the main image?

/*end global nav*/
/* for IE5.5 and IE6 only */
 #globalnav {
   position: relative;
   z-index: 2;
}
.home-main-text-wrapper {
   z-index: 1;
}
/***
__
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] Reset CSS

[David Hucklesby]

On 3/30/10 5:27 AM, Chris Blake wrote:
>
>>> From: Chris Blake
>>>
>>> Anyone know of a standard and simple reset.css file to use.
>>
>> This is a good, recent article from our very own Thierry:
>>
>> http://carsonified.com/blog/design/setting-rather-than-resetting-default-styling/
>>
>>
>>I think the general point to take from the current prevailing
>> opinion is: don't use a reset 'blindly', think about the effects
>> it's actually performing and adjust styles accordingly. IMO,
>> resets are far more relevant for quick mockup work and designing in
>> the browser rather than final production work.
>>
>
> I had a good read of this, ad then thought it might be a slim down
> version but it was bigger then others that I found. I attached it
> anyway to see what happened and there was scroll in the borwser, and
> I haven't even put content in yet. I may just do without to begin
> with.
>

Did you read this first item in the list of advantages Thierry notes?

  * It forces a gutter for a vertical scrollbar (when content is too
short to require a scrollbar)

But, yes. I think the general idea is you should "roll your own."
FWIW I went through all available "CSS frameworks" last year to come up
with mine. It has saved me oodles of time and effort since...

Cordially,
David
--

__
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] Problems with IE6

[Joe Jackson]

Thanks Guys

I have used

.globalnav {
   position: relative;
   z-index: 1;
}


however this is now putting the menu behing the main image on IE8 etc when
it was previously only occuring on IE6?

Anything else that I would need to do, does it need to go in an IE6 only
stylesheet?  If so what is the syntax required to achieve this
functionality.

Thanks
__
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] Reset CSS

[Chris Blake]

>> From: Chris Blake 
>>
>> Anyone know of a standard and simple reset.css file to
>> use.
>
> This is a good, recent article from our very own Thierry:
>
> http://carsonified.com/blog/design/setting-rather-than-resetting-default-styling/
>
> I think the general point to take from the current prevailing  
> opinion is: don't use a reset 'blindly', think about the effects  
> it's actually performing and adjust styles accordingly. IMO, resets  
> are far more relevant for quick mockup work and designing in the  
> browser rather than final production work.
>

I had a good read of this, ad then thought it might be a slim down  
version but it was bigger then others that I found. I attached it  
anyway to see what happened and there was scroll in the borwser, and I  
haven't even put content in yet. I may just do without to begin with.

Thanks, CB
__
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] teaching float v. absolute positioning

[Philip TAYLOR]

Tim Climis wrote:

> Mmm.  I believe he meant "they" to refer back to the elements.

Well, that's certainly one possible interpretation :
perhaps Alan will clarify.

** Phil.
__
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] teaching float v. absolute positioning

[Tim Climis]

On Tuesday, March 30, 2010 7:27:36 am CEO, Raynham Villas wrote:
> Alan Gresley wrote:
> > So absolutely positioned elements are offset (left, right, top and
> > bottom) from this initial containing block (viewport) unless it has an
> > ancestor with position relative, absolute or fixed [1].
> 
> If "it" refers back to "this initial containing block (viewport)",
> as one would expect from the normal rules of English grammar,
> then I'm not clear how "it" can have "an ancestor".
> 

Mmm.  I believe he meant "they" to refer back to the elements.

---Tim
__
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] teaching float v. absolute positioning

[CEO, Raynham Villas]

Alan Gresley wrote:

> So absolutely positioned elements are offset (left, right, top and
> bottom) from this initial containing block (viewport) unless it has an
> ancestor with position relative, absolute or fixed [1].

If "it" refers back to "this initial containing block (viewport)",
as one would expect from the normal rules of English grammar,
then I'm not clear how "it" can have "an ancestor".

Philip Taylor
__
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] teaching float v. absolute positioning

[Alan Gresley]

Jared Stein wrote:
> Hey all, I teach web design and dev courses at the college level and often 
> steer students away from absolute positioning as a first-choice CSS layout 
> solution in favor of float.
> 
> I've read John Faulds' post on the pitfalls of abs pos here 
> http://csscreator.com/node/11291 and use this as a "summary" of the 
> discussion for my students.  
> 
> Do any of you know of other hearty debates on the matter that would 
> illuminate students who will likely enter the professional web design/dev 
> field? Other opinions not covered in the CSSCreator thread?
> 
> --
> Jared M. Stein
> Director of Instructional Design Services
> Utah Valley University


I would think it is wise to explain the difference between the 
'initial containing block' and 'containing block'. The initial 
containing block is established by the viewport [1].

"The containing block in which the root element lives is a rectangle 
called the initial containing block. For continuous media, it has the 
dimensions of the viewport and is anchored at the canvas origin; it is 
the page area for paged media. The 'direction' property of the initial 
containing block is the same as for the root element."

So absolutely positioned elements are offset (left, right, top and 
bottom) from this initial containing block (viewport) unless it has an 
ancestor with position relative, absolute or fixed [1].

"If the element has 'position: absolute', the containing block is 
established by the nearest ancestor with a 'position' of 'absolute', 
'relative' or 'fixed."

If no offset is given, then the offset is treated as 'auto'. 
Absolutely positioned elements with offset 'auto' are positioned in 
respect to the direction of overflow. The default 'rtl' (bidirection) 
allows content to overflow the viewport to the right and bottom. For 
'ltr' the horizontal overflow works in reversed. Below are some test 
cases. Note how the body has a background of white and the html has a 
background of blue.




Things that are not mentioned in the CSSCreator Thread are the 
position of absolutely elements with offset of auto when interacting 
with inline elements [2] or floats [3]. Another is the use of absolute 
positioning for 'source ordering'. A simple construction is this.



.. 
.. 



body {
   margin: 0;
}
#content {
   margin-top: 100px;
}
#navigation {
   position: absolute;
   top: 0;
   height: 100px;
   width: 100%;
}



1. 
2. 
3. 



-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
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] Reset CSS

[Bobby Jack]

> From: Chris Blake 
> 
> Anyone know of a standard and simple reset.css file to
> use.

This is a good, recent article from our very own Thierry:

http://carsonified.com/blog/design/setting-rather-than-resetting-default-styling/

I think the general point to take from the current prevailing opinion is: don't 
use a reset 'blindly', think about the effects it's actually performing and 
adjust styles accordingly. IMO, resets are far more relevant for quick mockup 
work and designing in the browser rather than final production work.
__
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] Reset CSS

[Chris Blake]

Hi,

Anyone know of a standard and simple reset.css file to use.

I finally have a 'back to the old days' job, a website purely HTML and  
CSS, and standards compliant - what a cool challenge. The design has  
been done by print designers so it's not going to be easy either!

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