Re: [css-d] Problem with menu bar
On Wed, 19 May 2010, David Laakso wrote: ... Verdana was ditched because it is pug ugly -- particularly at default or greater than default. That is not true. Many people like Verdana. They prefer it over other fonts because it is more legible. -- Chris F.A. Johnson, http://cfajohnson.com 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] Problem with menu bar
Hi Chris, Verdana was ditched because it is pug ugly -- particularly at default or greater than default. That is not true. Many people like Verdana. They prefer it over other fonts because it is more legible. It may be more legible at *small size*, but as David said increase the size and it gets ugly. http://www.xs4all.nl/~sbpoley/webmatters/verdana.html http://www.zeldman.com/2010/04/18/verdana-pro-and-con-2/ A green version :) http://davidsimpson.me/2009/03/23/verdana-must-die-for-the-good-of-the-plane t/ -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz __ 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] Problem with menu bar
on both the pages below, the top menu bar (thick gray with thinner gray bar underneath it) are meant to extend to the right to infinity, but on the first of the two links below, Safari gets a horizontal scroll bar and scrolling to the right shows the menu bar visibly ending. Not so on page number 2, below. I have looked at the code and I can not see the reason for this. Now, I am not sure that I properly coded the go to the right forever property of this menu bar, but why does one page behave differently than the other one? Both use the same css style sheet, and that code up at the top is different, save only the image at the top, and they are identical pixel dimensions. thank you for any insight! John http://www.coffeeonmars.com/dez.html and http://www.coffeeonmars.com/two.html __ 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] Problem with menu bar
on both the pages below, the top menu bar (thick gray with thinner gray bar underneath it) are meant to extend to the right to infinity, but on the first of the two links below, Safari gets a horizontal scroll bar and scrolling to the right shows the menu bar visibly ending. Not so on page number 2, below. I have looked at the code and I can not see the reason for this. Now, I am not sure that I properly coded the go to the right forever property of this menu bar, but why does one page behave differently than the other one? Both use the same css style sheet, and that code up at the top is different, save only the image at the top, and they are identical pixel dimensions. thank you for any insight! That's because your last image on that page is 1279 pixel wide -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz __ 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] Problem with menu bar
On May 19, 2010, at 11:05 AM, Thierry Koblentz wrote: That's because your last image on that page is 1279 pixel wide yeah...it's a big boy, isn't it? ;-) so, is the remedy to ammend the code on that page, or is a 1279 pixel wide image just plain ridiculous? feel free to be frank in your response; I can take it. thanks! John __ 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] Problem with menu bar
so, is the remedy to ammend the code on that page, or is a 1279 pixel wide image just plain ridiculous? In marsB.css, line 27 Delete the width: 600px; (or change to min-width: 600px). That will let the paragraph expand to fit your image, which will in turn make the page expand to fit the paragraph, and your menu go all the way to the edge. As it stands, your image is hanging off the edge of the page, and you can only see the whole thing because the browser is being nice to you. ---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] Problem with menu bar
John wrote:
thank you for any insight!
John
http://www.coffeeonmars.com/dez.html
and
http://www.coffeeonmars.com/two.html
body {font: /*11px Verdana,*/100% Arial, Helvetica, sans-serif;
margin: 0; padding: 0;background: rgb(200,200,200); color: black;}
img {border: 1px solid fuchsia; display : block; max-width: 96%; height:
auto;}
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/
Re: [css-d] Problem with menu bar
That's because your last image on that page is 1279 pixel wide yeah...it's a big boy, isn't it? ;-) so, is the remedy to ammend the code on that page, or is a 1279 pixel wide image just plain ridiculous? I don't know if it's ridiculous or not, but it is what triggers the scrollbar. So either you make that image smaller or you use overflow:hidden on the parent to cut it off (but then why using an image that big to begin with?). As a side note, you should use ALT attribute with every single image you insert in your documents. -- Regards, Thierry www.tjkdesign.com | www.ez-css.org | @thierrykoblentz __ 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] Problem with menu bar
To save your visitors from having to horizontal-scroll (which most of them will hate), why not stack the last two images vertically instead of horizontally ? Philip Taylor John wrote: http://www.coffeeonmars.com/dez.html __ 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] Problem with menu bar
thank you for any insight!
John
http://www.coffeeonmars.com/dez.html
and
http://www.coffeeonmars.com/two.html
body {font: /*11px Verdana,*/100% Arial, Helvetica, sans-serif;
margin: 0; padding: 0;background: rgb(200,200,200); color: black;}
img {border: 1px solid fuchsia; display : block; max-width: 96%;
height:
auto;}
Max-width is a nice touch but it does not work in IE6 :-(
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
__
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] Problem with menu bar
Thierry Koblentz wrote:
thank you for any insight!
John
http://www.coffeeonmars.com/dez.html
and
http://www.coffeeonmars.com/two.html
body {font: /*11px Verdana,*/100% Arial, Helvetica, sans-serif;
margin: 0; padding: 0;background: rgb(200,200,200); color: black;}
img {border: 1px solid fuchsia; display : block; max-width: 96%;
height:
auto;}
Max-width is a nice touch but it does not work in IE6 :-(
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
Who cares?
~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/
Re: [css-d] Problem with menu bar
body {font: /*11px Verdana,*/100% Arial, Helvetica, sans-serif;
margin: 0; padding: 0;background: rgb(200,200,200); color:
black;}
img {border: 1px solid fuchsia; display : block; max-width: 96%;
height:
auto;}
Max-width is a nice touch but it does not work in IE6 :-(
Who cares?
Actually, the problem is even bigger *because* of IE6.
Modern browsers would let large image stick out of containers, but IE6 will
expand the container.
With the OP's construct it may be no big deal, but in most cases it would
trigger a drop float.
Not that we should care, but - imho - we should let people know.
--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz
__
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] Problem with menu bar
On May 19, 2010, at 12:00 PM, David Laakso wrote:
body {font: /*11px Verdana,*/100% Arial, Helvetica, sans-serif;
margin: 0; padding: 0;background: rgb(200,200,200); color: black;}
img {border: 1px solid fuchsia; display : block; max-width: 96%;
height:
auto;}
Best,
~d
thanks to all for the great suggestions. For now, I whacked the width
of that 1200 px wide image, but want to visit the code suggestions
made, including this bit above from the body declaration:
/*11px Verdana,*/100% - looks like you commented out 11px
Verdana, then added 100%..this is applied to all fonts, and indicates
the size OF the fonts?
John
__
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] Problem with menu bar
John wrote:
On May 19, 2010, at 12:00 PM, David Laakso wrote:
body {font: /*11px Verdana,*/100% Arial, Helvetica, sans-serif;
margin: 0; padding: 0;background: rgb(200,200,200); color: black;}
img {border: 1px solid fuchsia; display : block; max-width: 96%; height:
auto;}
Best,
~d
thanks to all for the great suggestions. For now, I whacked the width
of that 1200 px wide image, but want to visit the code suggestions
made, including this bit above from the body declaration:
/*11px Verdana,*/100% - looks like you commented out 11px Verdana,
then added 100%..this is applied to all fonts, and indicates the size
OF the fonts?
John
It is /a suggestion/ to set the content text at user default rather than
at your personal preference. If it were set in pixels at default it
would be 16px (but IE users have to jump through hoops -- put the
browser in accessibility mode -- to scale fonts set in pixels using the
5 font-size settings). And if it were set in em at default it would be
1em, in which case you would need to set font-size 100% on html, in
order to defeat an IE font-scaling bug.
Verdana was ditched because it is pug ugly -- particularly at default or
greater than default.
Most people ignore what I write about typography: do whatever does it
for you and yours.
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/
Re: [css-d] Problem with menu bar
David Laakso wrote: Verdana was ditched because it is pug ugly -- particularly at default or greater than default. How do you feel about Tahoma ? I prefer it to Verdana, and normally work at greater-than-default sizes. 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] Problem with menu bar
On May 19, 2010, at 3:21 PM, David Laakso wrote: Verdana was ditched because it is pug ugly -- particularly at default or greater than default. Thanks for shining a light on that..I had no idea those other measurement systems would cause such issue with IE users...seems IE is a usual suspect when it comes to things not working right. but as for Verdana being ditched because it is pug ugly - no argument there on it's aesthetic properties, but what it has (had?) going for it was its readability and presence on both mac and win platforms.' has this been thrown out the window? When I've seen Arial, especially on a windows pee cee, it wouldn't win no prizes for beauty either, but then windows often renders fonts with horrifying results. So...what's a rabbit to do? I can't have the faces I really want, so I use what I hope others will actually have... Is there another way? thanks! J __ 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] Problem with menu bar
John wrote: I can't have the faces I really want, so I use what I hope others will actually have... Is there another way? thanks! J We are off- topic with this [nothing to do with CSS] and I accept full responsibility and blame for that. 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/
