Re: [css-d] Divitus?

[Felix Miata]

On 2010/04/01 22:33 (GMT-0400) Tim Climis composed:

> On Thursday, April 01, 2010 10:06:52 pm T. R. Valentine wrote:

>> Is this a case of divitus?
>> http://home.comcast.net/~t.r.valentine/testing/

> The other thing you might do is set a max-width on the content.  In a 
> maximized browser window at 1280x1024, the lines get too long to be 
> comfortably readable.

I agree, except that screen resolution is irrelevant. As long as the
visitor's default font size is reasonably set for whatever his resolution is,
then a maximized browser will almost invariably produce too long lines when
allowed to fill most of the screen width.
http://webstyleguide.com/wsg3/8-typography/3-legibility.html has a decent
section on line length, an important component of most designs.
-- 
"Suppos [sic] a nation in some distant region, should
take the Bible for their only law book, and every member
should regulate his conduct by the precepts there
exhibited. . . . What a Eutopa, What a paradise would
this region be!"John Adams, 2nd US President

 Team OS/2 ** Reg. Linux User #211409

Felix Miata  ***  http://fm.no-ip.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] doctype

[Thierry Koblentz]

> From a pure CSS perspective the
> reasons for choosing HTML or XHTML are close to nil.

As a side note, one advantage of XHTML over HTML is that XHTML allows
authors to use an ID on  (which can be handy).


--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework




 

__
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] Divitus?

[Tim Climis]

On Thursday, April 01, 2010 10:06:52 pm T. R. Valentine wrote:
> Is this a case of divitus?
> http://home.comcast.net/~t.r.valentine/testing/
> 
> There are six s for the overall background image plus one for
> the bookmark image (which I foresee using for a menu). Too much? Is
> there a simpler way of accomplishing the same thing? I like the
> layout's flexibility (the background adjusts to the amount of text
> lengthwise and widthwise, but is never shorter than a bit past the
> bookmark image).
> 
> Any help/suggestions appreciated.

This isn't too bad, really.  The 6 empty divs are all serving a unique purpose 
that couldn't be served by anything less.  The 8 div flexy box (which this is 
just a variant of) is fairly well established.

But you could remove at least one div, maybe two, elsewhere.

#header could go away.  if you increase the bottom padding on the h1 and set 
the background color on it instead, you get the exact same effect.

The bookmark div could be changed to a ul instead, if you're planning on 
putting a menu (and only a menu) in it.  If you want to have multiple things 
in there, keep the div.

The other thing you might do is set a max-width on the content.  In a 
maximized browser window at 1280x1024, the lines get too long to be 
comfortably readable.

---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] Divitus?

[T. R. Valentine]

Is this a case of divitus?
http://home.comcast.net/~t.r.valentine/testing/

There are six s for the overall background image plus one for
the bookmark image (which I foresee using for a menu). Too much? Is
there a simpler way of accomplishing the same thing? I like the
layout's flexibility (the background adjusts to the amount of text
lengthwise and widthwise, but is never shorter than a bit past the
bookmark image).

Any help/suggestions appreciated.

-- 
T. R. Valentine
Your friends will argue with you. Your enemies don't care.
'When I get a little money I buy books; and if any is left I buy food
and clothes.' -- Erasmus
__
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] controlling the positioning of an image...

[David Laakso]

Matthew wrote:


Here is my first one: Please check this out:

http://www.em-w.com/oldschoolband/homepage2_nmk.html







> Thank you for the welcome and the advice David!
>   

O.K.






>   
>> -- usually with a new site an XHTML 1.0 Strict, or an HTML 4.01 Strict 
>> doctype is used
>> 
>
> Can you tell me the difference between XHTML 1.0 Strict and  XHTML 1.0 
> Transitional? I just used the defaults in Dreamweaver.
>   





Please see this page that explains the difference quite well:






>   
>> -- validate the markup and css as you work
>> 
>
> I'm sorry to say, I'm not sure what this means.
>   






The w3c Markup Validation Service

enables you, as a web page designer/author,  to check your page for 
mark-up errors.

Your current page has 43 mark-up errors:


The w3c CSS Validation Service

 finds errors that may need correction in cascading style sheets.

Your current site has a number of CSS errors in it:

 




>> -- avoid laying a page out with absolute positioning: floats based 
>> layouts work just fine and are less problematic
>> 
>
> Yes, the instructor in the video course I watched on Lynda.com suggest the 
> same. But I'm not yet skilled enough to control where things appear where are 
> supposed to appear through floats. On some pages I became so frustrated and 
> against the clock that I resorted to using tables to position things. 
> Hopefully, these skills will develop with time and perseverance.
>   





Layout the page using floats. Reserve absolute positioning, if needed at 
all, for positioning small and minor elements within the float 
structure. Your current page requires no absolute or fixed positioning 
whatsoever.






>
> Thank you for the clean-up version of my site and for your help David!
>
> - Matthew
>
>   
>






You are welcome. Good luck. Stay with it. You'll be glad you did. You 
can count on it.

Best,
~d





























__
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] controlling the positioning of an image...

[David Laakso]

Matthew wrote:
> Here is my first one: Please check this out:
>
> http://www.em-w.com/oldschoolband/homepage2_nmk.html
>
>
>
> - Matthew
>   


Welcome to the list, Matthew.

A few suggestions:

-- usually with a new site an XHTML 1.0 Strict, or an HTML 4.01 Strict 
doctype is used
-- validate the markup and css as you work
-- call the javascript from a directory
-- avoid laying a page out with absolute positioning: floats based 
layouts work just fine and are less problematic
-- if you want the crowd image tied to the bottom viewport, see "footer 
alt stick"

personally, I'd not even try that until you have a little more 
experience-- and even then it can be troublesome and difficult to get it 
working cross-browser.

This is a simplified version of your site: cursory checked in IE 6/7/8, 
Google Chrome, Safari, Opera, and Firefox.


Hth.

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] footer not following content

[Rob Emenecker]

Hi all,

I'm trying to implement a sticky footer that anchors to the bottom of the
viewport on pages whose content does not fill the viewport, and then have it
follow the content on pages that overflow the viewport.

I've been noodling with the implementation found at the following link:
http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page

You can see what I'm NOT getting on the following page:
http://www.mywildestdreamsstudio.com/test.html

On that "test" page the footer is positioned at the bottom of the viewport,
not the container div as it should be. Any thoughts on what I am missing, or
what element within the page is causing this to not work as desired?

Thanks,
Rob

__
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] controlling the positioning of an image...

[Matthew]

Hi everyone! This is my first post. 

I am new to CSS and find that I am fumbling around in the dark quite a bit. 
Therefore I was very pleased to discover this mailing list and hope that some 
experienced people will be able to help along the way. My hope is that I can 
bring specific questions to this forum as I come across them.

Here is my first one: Please check this out:

http://www.em-w.com/oldschoolband/homepage2_nmk.html


This site is my first attempt to build one using CSS. I know I rely too heavily 
on tables for layout, just like we did in the old days. My first CSS problem 
has to do with that crowd image that is fixed to the bottom of the window on 
the home page. The client likes it but would like the crowd to stop going up 
with a browser window one the browser becomes too small vertically. Is this 
possible? I can't think of a way.

Hopefully that question is clear and someone out there doesn't mind helping me! 
Thank you!

- Matthew
__
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] doctype

[Bob Rosenberg]

At 12:47 +0200 on 04/01/2010, MB wrote about Re: [css-d] doctype:

>Chris Blake told:
>
>>Sorry! This document can not be checked.
>>
>>When i try to validate anything that is UTF8.
>
>
>If you kept reading you would see that the validation page says further down:
>
>"I am unable to validate this document because on line 35  it contained
>one or more bytes that I cannot interpret as utf-8  (in other words, the
>bytes found are not valid values in the specified Character Encoding)"
>
>This means your file contains erroneus characters. What I usually do is
>to start a new utf-8 encoded HTML-file and start anew.
>If I have a more full source-file I copy the source and start a new
>utf-8 encoded HTML-file in my editor and paste the source code into
>that. Sometimes the erroneus characters may follow with the copy
>process. In that case you have to make sure you copy only valid parts.

This line should read "All content © 2010 
WCH ..." and it will be OK. The problem is that there is a 
literal © pasted there and this is an invalid UTF-8 character (since 
it is High-ASCII and thus needs to be UTF-8 Encoded - Use of © 
fixes this issue).
-- 

Bob Rosenberg
RockMUG Webmaster
webmas...@rockmug.org
www.RockMUG.org
__
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] Safari on Mac and PC?

[Tim Snadden]

On 2/04/2010, at 2:45 AM, Climis, Tim wrote:

>> Is Safari on windows and safari on Mac same? will my web page will  
>> look similar in them?
>> Also does FF on PC and on Mac renders the web page UI in same way?
>
> There are occasion differences, but they aren't common, and I don't  
> happen to know any of them off the top of my head, other than the  
> font rendering, which is done by the operating system, and not the  
> browser.

Another difference is form elements. Again, these are tied to the  
operating system so you will see a big difference with select boxes  
and buttons.
__
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] Unwanted horizontal scroll in IE 7/6

[Claude Needham]

On Thu, Apr 1, 2010 at 10:13 AM, Bill Braun  wrote:
>
>
> Tom Livingston wrote:
>> List,
>>
>> Can anyone see where the horizontal scrollbar is coming from in IE 6
>> and 7 at this address? I can't find it and i'm going nuts...
>>
>> http://www.mlinc.com/products/zpache/
>>
>> Thanks!
>>

I was able to reproduce the scrollbar in IE8 in compatibility view,
and in ieTester.

I have no clue what is "causing" the horizontal scrollbar to appear.
However, I can make it go away though by adding overflow:hidden to
your #outerWrap

#outerWrap{position: relative; overflow: hidden; background: #fff
url(../images/phase2/html_grey_bar.png) 0 0 repeat-x;}

I did this test on a local copy of the page (saved from firefox) with
all javascript removed. So when you try it on the actual page your
mileage may vary.

Also, poking code with a stick until it works is not what one would
call the elegant solution. :)

By the way, from what I could see in a couple of web references,
expression has been dropped as of IE8.

#sb-overlay{
height:expression(document.documentElement.clientHeight + 'px');
}

Claude
__
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] Unwanted horizontal scroll in IE 7/6

[Bill Braun]

Tom Livingston wrote:
> List,
>
> Can anyone see where the horizontal scrollbar is coming from in IE 6
> and 7 at this address? I can't find it and i'm going nuts...
>
> http://www.mlinc.com/products/zpache/
>
> Thanks!
>   
I was only able to duplicate this in IE Tester, simulating IE7. I have 
IE6 installed that I use for testing; I was not able to duplicate the 
horizontal scroll bar.

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] Unwanted horizontal scroll in IE 7/6

[Chris F.A. Johnson]

On Thu, 1 Apr 2010, Tom Livingston wrote:

> List,
> 
> Can anyone see where the horizontal scrollbar is coming from in IE 6
> and 7 at this address? I can't find it and i'm going nuts...
> 
> http://www.mlinc.com/products/zpache/

   I see a horizontal scrollbar in Firefox -- if my browser window is
   less than a certain width.

   If you let the page expand or contract according to the viewer's
   window, instead of giving it a fixed width (e.g., 60% instead of
   680px), there wouldn't be a scrollbar.

-- 
   Chris F.A. Johnson, 
   Author:
   Pro Bash Programming: Scripting the GNU/Linux Shell (2009, Apress)
   Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
__
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] Unwanted horizontal scroll in IE 7/6

[David Laakso]

Tom Livingston wrote:
> List,
>
> Can anyone see where the horizontal scrollbar is coming from in IE 6
> and 7 at this address? I can't find it and i'm going nuts...
>
> http://www.mlinc.com/products/zpache/
>
> Thanks!
>
>   




I see no h-scroll bar in any browser including IE 6/7 at 1024 and up?

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] Unwanted horizontal scroll in IE 7/6

[Tom Livingston]

List,

Can anyone see where the horizontal scrollbar is coming from in IE 6
and 7 at this address? I can't find it and i'm going nuts...

http://www.mlinc.com/products/zpache/

Thanks!

-- 

Tom Livingston | Senior Interactive Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.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] Safari on Mac and PC?

[Climis, Tim]

> Is Safari on windows and safari on Mac same? will my web page will look 
> similar in them? 
> Also does FF on PC and on Mac renders the web page UI in same way?

I can't say yes because it's not entirely true, so the answer is "Mostly."

Pages look the same across browsers and operating systems, as long as they use 
the same rendering engine.  For instance, Safari and Google Chrome both use the 
Webkit Engine (regardless of operating system), and so pages will (mostly) look 
identical in Chrome for Windows and Safari for Mac.  All platforms of Firefox 
use the Gecko engine, and all platforms of Opera use Presto.

There are occasion differences, but they aren't common, and I don't happen to 
know any of them off the top of my head, other than the font rendering, which 
is done by the operating system, and not the browser.

---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] doctype

[Bill Braun]

I have struggled for the longest time to understand the obvious. For 
some reason the differences between HTML 4.01 and XHTML were completely 
lost on me.

And now? Eureka, the dawn finally breaks. Thanks to Chris, Norman, 
Thierry, MB, and Philip. I don't know that you said anything terribly 
different that what I've read before, but it was laid out in a real 
clear manner.

And thanks to Chris for the initial post.

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/

[css-d] Safari on Mac and PC?

[Ram]

Is Safari on windows and safari on Mac same? will my web page will look similar 
in them? 
Also does FF on PC and on Mac renders the web page UI in same way?


Best Regards:
Ram



  
__
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] doctype

[MB]

Chris Blake told:

>Sorry! This document can not be checked.
>
>When i try to validate anything that is UTF8.


If you kept reading you would see that the validation page says further down: 

"I am unable to validate this document because on line 35  it contained
one or more bytes that I cannot interpret as utf-8  (in other words, the
bytes found are not valid values in the specified Character Encoding)"

This means your file contains erroneus characters. What I usually do is
to start a new utf-8 encoded HTML-file and start anew.
If I have a more full source-file I copy the source and start a new
utf-8 encoded HTML-file in my editor and paste the source code into
that. Sometimes the erroneus characters may follow with the copy
process. In that case you have to make sure you copy only valid parts. 



__
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] doctype

[Philip TAYLOR]

Norman Fournier wrote:

> Try using XHTML, which is cleaner markup, with this doctype:
>
>   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
> http://www.w3.org/1999/xhtml";>

Unfortunately this would introduce a further complication, in that
the content should then be served with MIME-type

application/xhtml+xml

However, if you do this, then at least one major browser will
fail to handle it properly.  Thus, as others have already
said, you would do better to use one of the three HTML 4.01
variants (strict, transitional or frameset : the last is
irrelevant in this context), and whilst the purist in me
would advocate "strict", a more pragmatic person might
recommend transitional until you yourself become more familiar
with the standards.

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] doctype

[MB]

Chris Blake said:

>What gives, I can't even pass 100% before writing anything!

You are mixing the syntax of HTML and XHTML. I wouldn't be using XHTML
unless I had specific reasons for that. From a pure CSS perspective the
reasons for choosing HTML or XHTML are close to nil. However, if you're
going to use CSS layout techniques the strict versions of either
language gives less surprises and more consistent results. There are
circumstances when it could be adviseable to choose the transitional,
but I would argue that's rare.
HTML 4.01 Strict is what I use:

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





and so on

Note there is no trailing "/" in the meta element.

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