Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > picture width decides table column width

Reply
Thread Tools

picture width decides table column width

 
 
David Basford
Guest
Posts: n/a
 
      09-28-2007
I have a problem that I can't get my head around
I use php to call this but the end result is

<table width='90%' border='0' cellspacing='8' cellpadding='6' >
<tr>
<td width='27%'><span class='resourceheader2'>Text</span><br><br><img
src='Pic.jpg'></td>
<td width='18%'>stuff</td>
<td>stuff</td>
</tr>
</table>

but the picture seems to set the width - and the other columns get minimised
if I set
<img src='Pic.jpg' width='27%'>
then it ends up with a column of the width of the original pic with a 27%
size picture in it

I don't want to fix the column widths if I don't have to - but it might be
my only choice.

Any ideas what is wrong here?

I'm not a regular here - please be lenient if I'm being dumb


 
Reply With Quote
 
 
 
 
Harlan Messinger
Guest
Posts: n/a
 
      09-28-2007
David Basford wrote:
> I have a problem that I can't get my head around
> I use php to call this but the end result is
>
> <table width='90%' border='0' cellspacing='8' cellpadding='6' >
> <tr>
> <td width='27%'><span class='resourceheader2'>Text</span><br><br><img
> src='Pic.jpg'></td>
> <td width='18%'>stuff</td>
> <td>stuff</td>
> </tr>
> </table>
>
> but the picture seems to set the width - and the other columns get minimised
> if I set
> <img src='Pic.jpg' width='27%'>
> then it ends up with a column of the width of the original pic with a 27%
> size picture in it


"Note that lengths expressed as percentages are based on the horizontal
or vertical space currently available, not on the natural size of the
image, object, or applet."
http://www.w3.org/TR/html4/struct/ob...adef-width-IMG

 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      09-28-2007
In article <AodLi.2069$%(E-Mail Removed)>,
"David Basford" <(E-Mail Removed)> wrote:

> I have a problem that I can't get my head around
>
> <table width='90%' border='0' cellspacing='8' cellpadding='6' >
> <tr>
> <td width='27%'><span class='resourceheader2'>Text</span><br><br><img
> src='Pic.jpg'></td>
> <td width='18%'>stuff</td>
> <td>stuff</td>
> </tr>
> </table>
>
> but the picture seems to set the width


It depends on whether the pic is specified with a width. If it is
not and it is small, say 10px, it will take up only a portion of
a table cell width set at 27% of the width of the table (which in
turn) is set at 90% of the width of the table's containing body
which might be body and is likely to be at least 800px wide...

You should know that the natural width of the picture (the 100%
size of it as viewed in any image software) is the width of a pic
unless you otherwise specify it. Thus if you say it is 50px, or
50% then the browser will try to accommodate that and ignore the
native width. % are tricky because it is always relative to the
containing element and you need o ask what is the width of
*that*, will *that* accommodate, will *that* fit. Tables are
intelligent creatures and try their best to be everything to
everyone.

> - and the other columns get minimised
> if I set
> <img src='Pic.jpg' width='27%'>
> then it ends up with a column of the width of the original pic with a 27%
> size picture in it
>
> I don't want to fix the column widths if I don't have to - but it might be
> my only choice.
>
> Any ideas what is wrong here?
>


It depends on what you are trying to do? It is not clear quite
what you want to happen? What do you imagine or want to happen
for your visitors on different browsers, different screens or
platforms? Once that is known, further advice is possible.

Here is some code that gives a doctype and you can play about:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;
charset=utf-8">
<title>List with em dimmed bullets</title>
<style type="text/css">
table {width: 90%;}
td {border: 1px solid #000;}
</style>
</head>

<body>
<table cellspacing='8' cellpadding='6' >
<tr>
<td style="width:27%"><img src="bazzieinwatera.jpg" width="10px"
alt=""></td>
<td style="width:18%">stuff</td>
<td>stuff</td>
</tr>
</table>
</body>
</html>

I am not quite sure if you are thinking about the situation of
specifying a cell to be 27% and also a pic to be 27%. If so, add
in the style in the head

img {width: 27%;}

leave off dimensioning the image inline in <img...> and see how
the image will under some generous browser widths take up only
about a quarter of that cell's width.

--
dorayme
 
Reply With Quote
 
BootNic
Guest
Posts: n/a
 
      09-30-2007
"David Basford" <(E-Mail Removed)> wrote:
news:AodLi.2069$%(E-Mail Removed):

> I have a problem that I can't get my head around

[snip]
> but the picture seems to set the width - and the other columns get
> minimised if I set
> <img src='Pic.jpg' width='27%'>
> then it ends up with a column of the width of the original pic with a
> 27% size picture in it
>
> I don't want to fix the column widths if I don't have to - but it
> might be my only choice.
>
> Any ideas what is wrong here?

[snip]

table-layout:fixed;

example:
http://bootnic.atwebpages.com/ScaleImageTableCell.php

--
BootNic Sunday September 30, 2007 6:48 PM
"Do not trust your memory; it is a net full of holes; the most
beautiful prizes slip through it."
*Georges Duhamel, The Heart's Domain*
 
Reply With Quote
 
 
 
Reply

Thread Tools

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

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
How to set table column width except the last column? Cal Java 1 01-08-2007 06:55 AM
Problem with comparing a Table View Column with the Table Column? savvy ASP .Net 1 01-18-2006 03:04 PM
appearance: windows decides what's best melanie Computer Support 3 06-21-2005 01:17 PM
DG Column Width vs Table Column Width Carl Howarth ASP .Net Datagrid Control 1 10-24-2004 08:48 AM
Re: resized image in table extends table width to original image width Sean Jorden HTML 1 08-19-2003 08:59 AM



Advertisments