HighDots Forums  

Re: containing floating img height within a div

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss Re: containing floating img height within a div in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Chris F.A. Johnson
 
Posts: n/a

Default Re: containing floating img height within a div - 01-29-2009 , 05:26 PM






On 2009-01-29, Troy Piggins wrote:
Quote:
I'm rewriting my simple blog/website/gallery at the moment.
Having a little trouble with some css for it.

Here's the beginnings of my page:
http://piggo.com/~troy/index_new.php

See how the bottom border of the first paragraph cuts off part
way through the image on the left? It's because the paragraph is
shorter than the height of the image.
You can't know that. Some people may use a larger font size which
makes the paragraph longer than the image.

Quote:
The second section all looks ok as I want it for when the text is
longer than the img height.
You can't know that. Some people may use a smaller font size which
makes the paragraph shorter than the image.

Quote:
What I want for that first entry is just blank space under the
text down until the bottom of the image, then the border to be
under the image.
Use <hr> with clear: left; instead of border-bottom/

The size you use on that page is far too small for me to read. To
make the page work for everyone, remove font-size: 10pt; you don't
need it.

Also, if I have a large browser window, there are blank columns
left and right; if I view it with a small browser window, there are
horizontal scroll bars. Specify your widths in percentages rather
than px and the page will fill my window no matter what size it is.

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
================================================== =================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)


Reply With Quote
  #2  
Old   
rf
 
Posts: n/a

Default Re: containing floating img height within a div - 01-29-2009 , 06:27 PM






Troy Piggins wrote:
Quote:
* Chris F.A. Johnson wrote :
* Troy Piggins wrote:

http://piggo.com/~troy/index_new.php

The size you use on that page is far too small for me to read. To
make the page work for everyone, remove font-size: 10pt; you don't
need it.

For me, without the font-size specified the text looks
cartoon-like big. Could be my font selection. I'm seeing the
Trebuchet MS font which I like. What font are you seeing?
So change the settings in *your* browser.
Quote:
Would using font-size: small etc be preferable?
font-size: 100%; (or none at all) is preferable. That way everybody gets
their chosen default.

If you specify something smaller then everybody has to wind up their font
size when they visit your site and then wind it back down again when they
leave. Also, modern browsers have a setting for minimum font size. Ever
thought why there is no setting for maximum font size?




Reply With Quote
  #3  
Old   
rf
 
Posts: n/a

Default Re: containing floating img height within a div - 01-29-2009 , 07:49 PM



Troy Piggins wrote:
Quote:
* rf wrote :

I wasn't aware of that min font size setting, but see it now.
Hey, if people actually used this we wouldn't be having this
conversation anyway
Hey, if web authors didn't specify font sizes way smaller than the users
default we wouldn't have a min font size setting :-)




Reply With Quote
  #4  
Old   
Chris F.A. Johnson
 
Posts: n/a

Default Re: containing floating img height within a div - 01-29-2009 , 09:08 PM



On 2009-01-30, rf wrote:
Quote:
Troy Piggins wrote:
* rf wrote :

I wasn't aware of that min font size setting, but see it now.
Hey, if people actually used this we wouldn't be having this
conversation anyway

Hey, if web authors didn't specify font sizes way smaller than the users
default we wouldn't have a min font size setting :-)
I'd be very happy if it were unnecessary.

Very often, when a page has a very small font size, all variations
in size, except for headers, are lost: they are all shown at the
minimum font-size set in my browser.

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
================================================== =================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)


Reply With Quote
  #5  
Old   
Steve Broski
 
Posts: n/a

Default Re: containing floating img height within a div - 01-29-2009 , 09:09 PM



Troy Piggins wrote:

Quote:
So change the settings in *your* browser.

....

Sorry about all that. No font-size specified now.
Yahoo sets a global "font-size:13px".
CNN: body {font-size: small}
Google: html, body {font-size: small}
Whitehouse.gov: body {font-size: 12px}
Amazon.com: body {font-size: small}

These are sites that have spent extraordinary sums of money and effort
ensuring their traffic has the best experience. And clearly they
noticed, just as you have, that default browser font sizing is
unpleasantly large and have forcibly reduced font sizing to compensate.

Set a global font size that looks best for default browser settings as
the VAST, VAST majority of your traffic will arrive on your page with
exactly those settings. While they have the means to do so, surfers
don't modify their font sizing within their browser. Best to accommodate
for that fact.


Reply With Quote
  #6  
Old   
rf
 
Posts: n/a

Default Re: containing floating img height within a div - 01-29-2009 , 09:45 PM



Steve Broski wrote:
Quote:
Troy Piggins wrote:

So change the settings in *your* browser.

This topic has been done to death in several newsgroups so I'll only make
two comments.

Quote:
Sorry about all that. No font-size specified now.

Yahoo sets a global "font-size:13px".
CNN: body {font-size: small}
Google: html, body {font-size: small}
Whitehouse.gov: body {font-size: 12px}
Amazon.com: body {font-size: small}

These are sites that have spent extraordinary sums of money
1) to graphic designers, who are the ones most responsible for stuffing up
web sites.

Quote:
ensuring their traffic has the best experience. And clearly they
noticed, just as you have, that default browser font sizing is
unpleasantly large and have forcibly reduced font sizing to
compensate.
2)Lemmings




Reply With Quote
  #7  
Old   
Steve Broski
 
Posts: n/a

Default Re: containing floating img height within a div - 01-30-2009 , 01:38 AM



Quote:
Sorry about all that. *No font-size specified now.

Yahoo sets a global "font-size:13px".
CNN: body {font-size: small}
Google: html, body {font-size: small}
Whitehouse.gov: body {font-size: 12px}
Amazon.com: body {font-size: small}
These are sites that have spent extraordinary sums of money

1) to graphic designers, who are the ones most responsible for stuffing up
web sites.

ensuring their traffic has the best experience. *And clearly they
noticed, just as you have, that default browser font sizing is
unpleasantly large and have forcibly reduced font sizing to
compensate.

2)Lemmings
Compelling arguments to be sure.

Still, I'll follow the mindset of >$40 billion in revenue over a
newsgroup posting.


Reply With Quote
  #8  
Old   
rf
 
Posts: n/a

Default Re: containing floating img height within a div - 01-30-2009 , 01:53 AM



Steve Broski wrote:
Quote:
Sorry about all that. No font-size specified now.

Yahoo sets a global "font-size:13px".
CNN: body {font-size: small}
Google: html, body {font-size: small}
Whitehouse.gov: body {font-size: 12px}
Amazon.com: body {font-size: small}
These are sites that have spent extraordinary sums of money

1) to graphic designers, who are the ones most responsible for
stuffing up web sites.

ensuring their traffic has the best experience. And clearly they
noticed, just as you have, that default browser font sizing is
unpleasantly large and have forcibly reduced font sizing to
compensate.

2)Lemmings

Compelling arguments to be sure.

Still, I'll follow the mindset of >$40 billion in revenue over a
newsgroup posting.
Still don't get it, do you?

Sure, they get >$40 whatever. If they also catered for the large group of
people out there with poor eyesight (read: older, and richer) they might
make >$60 whatever.

Just because five (yes, you quoted five URLS) sites do something that makes
it hard for a certain percentage of viewers does not make it advisable for
everyone to do it. And just where is your connection between having small
font size and making lots of money. I would conject that it is "making lots
of money *in spite of* small font size.

I for one will most certainly *not* put any obstacles at all in front of my
viewers. Would you stand in the doorway of your shoe shop and demand that
each prospective entrant pass an eye test before entering your shop?




Reply With Quote
  #9  
Old   
Steve Broski
 
Posts: n/a

Default Re: containing floating img height within a div - 01-30-2009 , 02:57 AM



On Jan 29, 10:53*pm, "rf" <r...@z.invalid> wrote:
Quote:
Steve Broski wrote:
Sorry about all that. No font-size specified now.

Yahoo sets a global "font-size:13px".
CNN: body {font-size: small}
Google: html, body {font-size: small}
Whitehouse.gov: body {font-size: 12px}
Amazon.com: body {font-size: small}
These are sites that have spent extraordinary sums of money

1) to graphic designers, who are the ones most responsible for
stuffing up web sites.

ensuring their traffic has the best experience. And clearly they
noticed, just as you have, that default browser font sizing is
unpleasantly large and have forcibly reduced font sizing to
compensate.

2)Lemmings

Compelling arguments to be sure.

Still, I'll follow the mindset of >$40 billion in revenue over a
newsgroup posting.

Still don't get it, do you?
Actually, I do know the answer.

Quote:
Sure, they get >$40 whatever. If they also catered for the large group of
people out there with poor eyesight (read: older, and richer) they might
make >$60 whatever.

Just because five (yes, you quoted five URLS) sites...
Ubuntu, Apple, Facebook, ESPN, Expedia, EBay, Library of Congress,
AOL, IBM, Bank of America ... I can go on forever. Real question is,
can you find a top-100 site that *doesn't* reduce font-size on a grand
scale? Or even a couple top-500 sites? Seems like it's pretty much
the web preachers, Jakob Nielsen and W3C standing alone on the issue.

Honestly, I'm pretty sure these guys have pondered the idea of larger
default font sizing. Pretty sure the majority of them have tested
larger font sizes as well.

Quote:
do something that makes
it hard for a certain percentage of viewers does not make it advisable for
everyone to do it. And just where is your connection between having small
font size and making lots of money. I would conject that it is "making lots
of money *in spite of* small font size.

I for one will most certainly *not* put any obstacles at all in front of my
viewers. Would you stand in the doorway of *your shoe shop and demand that
each prospective entrant pass an eye test before entering your shop?
I'm sure your store would be all white with 20pt serif black fonts
promoting each shoe as well. Marketing to the lowest common
denominator always works out well. That's why malls and shopping
centers all look the way they do - completely bland and all, right?

You do realize all web font sizing is arbitrary -- regardless of CSS
rules -- right? Why you feel a couple browser vendors nailed the
default font size correctly (and therefore shouldn't conceivably be
adjusted) in contrast to essentially every single major entity with a
web presence that has independently determined what works best is odd,
to put it lightly.



Reply With Quote
  #10  
Old   
Bergamot
 
Posts: n/a

Default Re: containing floating img height within a div - 01-30-2009 , 02:56 PM




rf wrote:
Quote:
And just where is your connection between having small
font size and making lots of money. I would conject that it is "making lots
of money *in spite of* small font size.
I attended a webinar not long ago that was put on by a well-known
usability group. They mentioned that the biggest complaint by users was
text size that's too small. It's the biggest complaint I hear, as well.

So yeah, I'd say that sites do well in spite of small text.

--
Berg


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.