I've done some more testing now and I think I know where I have been
going wrong. However I am stumped as to what to do about it.
The reason the image is apparently not displaying now that I have
validated my html is that in order to satisfy xhtml requirements I
had to remove the width property from the table cells. I had been
using this in order to get the middle column to resize while fixing
the width of the left and right columns. Without the width properties
the browser is making its best guess as to the positions of the
images. Since it seems to choose not to make the middle td wider than
1 pixel it is never tiling the background in that td. I think.
As an experiment I put the width property back in and now only IE
"breaks". Looking closer at the IE rendition I think that it is just
ignoring my table cell width properties, and in effect guessing at
the appropriate widths for the td elements.
The upshot is: how can I achieve the effect I want? I should probably
be aiming to remove this table structure altogether, so what I need
to do is have my graphic resizing in another way. I haven't had much
experience with CSS positioning commands, but is that a way to do it?
Incidentally, i don't mind slicing the overall image differently - I
only want to end up with a bevelled round rectangle that resizes
horizontally when I stretch the window.
Thanks for any suggestions.
Ian.
--
Dr Ian M Piper
[EMAIL PROTECTED]
--
Where is the wisdom we have lost in knowledge?
Where is the knowledge we have lost in information?
On 19 Aug 2005, at 9:46, Ian Piper wrote:
Further to my earlier message: I'm slightly more confused now. I
thought that perhaps I had not properly validated the xhtml or css,
so have done both now. The result is that the page now behaves
almost equally badly on Safari, Firefox and IE. I guess from this
that there is something basically wrong with my use of a gif file
as a background image in a table cell.
I have put the offending page up on my site at this url in case
anyone has a chance to take a look at it: http://www.tellura.co.uk/
gtpr/index.htm
Thanks,
Ian.
--
Dr Ian M Piper
[EMAIL PROTECTED]
--
Where is the wisdom we have lost in knowledge?
Where is the knowledge we have lost in information?
On 18 Aug 2005, at 9:59, Ian Piper wrote:
Hi,
I'd appreciate some advice on a problem with a site I'm designing.
The problem is that a gif file that I am using as a background
image in a table cell is not visible in IE although it looks fine
in Safari and Firefox.
I thought that this in the css file:
td#sectionheadingmiddle {
background: #f4c035 url(../images/sectionheadingmiddle.gif);
}
and this in the html file
<tr>
<td width="416"><img src="images/sectionheadingleft.gif"
width="416" height="60" border="0" alt="*"></td>
<td id="sectionheadingmiddle"><img src="images/spacer.gif"
width="1" height="60" alt="*" /></td>
<td width="6"><img src="images/sectionheadingright.gif"
width="6" height="60" border="0" alt="*"></td>
</tr>
would work. However although it renders nicely in Safari on my Mac
and Firefox under Windows XP, IE6 just shows a white background
for the td with id=sectionheadingmiddle. The intention by the way
is to allow this middle column in my table to resize when the user
resizes the window. The three images make up a rounded rectangle
that needs to stretch horizontally to sit atop this middle column.
If there is a more sensible way to achieve that effect I would
welcome some guidance.
Thanks,
Ian.
--
Dr Ian M Piper
[EMAIL PROTECTED]
--
Where is the wisdom we have lost in knowledge?
Where is the knowledge we have lost in information?
_____________________________________________________________________
_
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
