473,396 Members | 1,671 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,396 software developers and data experts.

Table TD width not rendering correctly

I am trying to create a web page that shows a calendar schedules. I am
attempting to use table cells with fixed widths and different colors to
display this.

It seems that IE6 doesn't always correctly render the widths exactly as
intended. I am using dream weaver and when I copy the HTML code into
that it renders perfectly.

Is there any known issues with the way IE6 renders table cells with
fixed widths?

Thanks!

Karl

Jul 23 '05 #1
16 12848
ka*****@pacbell.net wrote:
I am trying to create a web page that shows a calendar schedules. I am
attempting to use table cells with fixed widths and different colors to
display this.
You should have posted the URL of your best attempt so far. And maybe
considered the group for your posting - setting widths and especially
colors is best done in CSS, not in HTML.
It seems that IE6 doesn't always correctly render the widths exactly as
intended.
That is true, and correct, for suitable values of "correct". Browsers are
expected to override your width suggestions in many situations.
Is there any known issues with the way IE6 renders table cells with
fixed widths?


Yes. But we need to see the patient before suggesting a cure. Someone might
want to sell you some table-layout: fixed snake oil, but beware.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

Jul 23 '05 #2
"" wrote in comp.infosystems.www.authoring.html:
I am trying to create a web page that shows a calendar schedules. I am
attempting to use table cells with fixed widths and different colors to
display this.

It seems that IE6 doesn't always correctly render the widths exactly as
intended.


For once, IE isn't wrong. Any width specification you make is a
_suggestion_ to the browser. Browsers are free to adjust table-cell
widths based on the content.

If you give us the URL of your page we might be able to suggest a
way to code it that is more likely to give the widths you're after,
though still not guaranteed even in a proper browser.

--

Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
Jul 23 '05 #3
I have uploaded my latest effort. If you hover over the colored areas
then you will see a popup that shows the meeting times. I am trying to
get them to line up properly with the times above. When I copy this
code into Dreamweaver it lines up perfectly...

My next effort will be to try doing it with images...

Thank you!!

http://www.geocities.com/uberkase/default.htm

Karl

Jul 23 '05 #4
Gazing into my crystal ball I observed "karlman" <ka*****@pacbell.net>
writing in news:11*********************@g14g2000cwa.googlegro ups.com:
I have uploaded my latest effort. If you hover over the colored areas
then you will see a popup that shows the meeting times. I am trying to
get them to line up properly with the times above. When I copy this
code into Dreamweaver it lines up perfectly...

My next effort will be to try doing it with images...

Thank you!!

http://www.geocities.com/uberkase/default.htm

Karl


I can see several problems with page.

First, take things like this: <TD style='border:solid 1px #000000'
width='35'> and turn it into this:
..times {border:solid 1px #000000; width:35px}
<td class="times">

You have other issues with nesting tables. That's always a bad idea, IMHO.
Keep everything in the same table.

I would not use the title attribute to describe the events. It might not
be available to the user long enough. Make the width and height of the
cell large enough to take a certain amount of character, and use only that
amount of character.

You would also be better off keeping the width of each cell the same,
regardless of whether the date is available or not.

I have an example calendar I made last year. You're more than welcome to
look at the source and CSS to see what I did:
<http://www.cavalcade-of-coding.info/usenet/calendar.html>

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Jul 23 '05 #5
"karlman" <ka*****@pacbell.net> wrote in news:1109700610.147052.31980
@g14g2000cwa.googlegroups.com:
I have uploaded my latest effort. If you hover over the colored areas
then you will see a popup that shows the meeting times. I am trying to
get them to line up properly with the times above. When I copy this
code into Dreamweaver it lines up perfectly...

My next effort will be to try doing it with images...

Thank you!!

http://www.geocities.com/uberkase/default.htm

Karl


Following Adrienne's comments, you really need to do something to the
title attribs. Might be worth having a message bar below to show any such
up, avoiding the variable quality of the output displayed - FF doesn't
like the spacing etc, whereas IE blocks it quite well (for a change).
The message back can be done with a onMouseOver/onFocus/onClick,
depending on how you want to trigger.
Jul 23 '05 #6
Thank you Adrienne!

I converted my styles into CSS/Class and eliminated the nested tables.
Thank you for the suggestions.

I took a look at your calendar which was nice but won't really help me
here because I am trying to show the hours that a room is booked.

I have actually got everything to work and I really appreciate your
help!

Both you and s_m_b suggest eliminating the title (now alt since I am
using images inside of a single cell rather than cells thenselves). Is
this primarily because some browsers won't display it properly or that
it only lasts for a few seconds when the mouse is not moving?

Thank you!

Jul 23 '05 #7
"karlman" <ka*****@pacbell.net> wrote in news:1109878847.988496.297800
@g14g2000cwa.googlegroups.com:
Thank you Adrienne!

I converted my styles into CSS/Class and eliminated the nested tables.
Thank you for the suggestions.

I took a look at your calendar which was nice but won't really help me
here because I am trying to show the hours that a room is booked.

I have actually got everything to work and I really appreciate your
help!

Both you and s_m_b suggest eliminating the title (now alt since I am
using images inside of a single cell rather than cells thenselves). Is
this primarily because some browsers won't display it properly or that
it only lasts for a few seconds when the mouse is not moving?
the 'alt' tag is actually intended as a descriptor when images are
suppressed, or for text-only browsing - eg text-to-speech.
If you view via FireFox and via IE, you'll see the difference.
For the purpose of 'snapshot' type views, you #can# get away with them -
I use just such a technique for showing data that simply won't fit
anywhere else, but gives context to a link - but for practical viewing
and use, you really need something that will produce the detail and hold
it as long as needs be.

Thank you!


Jul 23 '05 #8
On Thu, 3 Mar 2005, s_m_b wrote:
the 'alt' tag is actually intended as a descriptor


The "alt" text is called "alt" because it's intended to be a textual
*alternative*. If it was meant to be a description, rather than an
alternative, then I reckon it would have been called something else.
Jul 23 '05 #9
Tim
s_m_b wrote:
the 'alt' tag is actually intended as a descriptor

"Alan J. Flavell" <fl*****@ph.gla.ac.uk> posted:
The "alt" text is called "alt" because it's intended to be a textual
*alternative*. If it was meant to be a description, rather than an
alternative, then I reckon it would have been called something else.


I won't argue what alt means, as it's well defined, and anybody (by now)
arguing to the contrary is being a fool. But I don't know if I'd go along
with they'd have named it differently for *sensible* reasons. After all,
the "title" attribute would rarely be used as a title for the element it's
used with.

--
If you insist on e-mailing me, use the reply-to address (it's real but
temporary). But please reply to the group, like you're supposed to.

This message was sent without a virus, please delete some files yourself.
Jul 23 '05 #10
"Alan J. Flavell" <fl*****@ph.gla.ac.uk> wrote in
news:Pi*******************************@ppepc56.ph. gla.ac.uk:
On Thu, 3 Mar 2005, s_m_b wrote:
the 'alt' tag is actually intended as a descriptor


The "alt" text is called "alt" because it's intended to be a textual
*alternative*. If it was meant to be a description, rather than an
alternative, then I reckon it would have been called something else.


same thing! use to 'describe' the image for text-only. Of course, you can
have some garbage in there, but that kind of defeats the point...
Jul 23 '05 #11
On Fri, 4 Mar 2005, s_m_b wrote:
The "alt" text is called "alt" because it's intended to be a textual
*alternative*. If it was meant to be a description, rather than an
alternative, then I reckon it would have been called something else.
same thing!


Don't agree. Neither do the W3C, when they're having one of their
clear-headed days.
use to 'describe' the image for text-only.
Used to provide a textual alternative for the image.
Of course, you can have some garbage in there,
Who says you can?
but that kind of defeats the point...


Exactly. What -was- the point again? Answer in your own time: you
may refer to the HTML4.01 specification and to the relevant WAI
guidelines. SCNR.

http://www.w3.org/TR/html401/struct/objects.html#h-13.8

http://www.w3.org/TR/WCAG10/#gl-provide-equivalents

*Sometimes* the best textual equivalent might be a description of the
image, but in my experience that's the wrong choice more often than
it's right - with results that range from the slightly silly to the
absurd.

Jul 23 '05 #12
me
<ka*****@pacbell.net> wrote in message
news:11*********************@f14g2000cwb.googlegro ups.com...
I am trying to create a web page that shows a calendar schedules. I am
attempting to use table cells with fixed widths and different colors to
display this.

It seems that IE6 doesn't always correctly render the widths exactly as
intended. I am using dream weaver and when I copy the HTML code into
that it renders perfectly.

Is there any known issues with the way IE6 renders table cells with
fixed widths?

Thanks!

Karl


Save this as an HTML document or open the DW code view and paste it in. Note
that you may have to fix the line wraps.
Good Luck,
me

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
..border { border: 1px #000000 solid}
-->
</style>
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v3.0
var p,i,x; if(!d) d=document;
if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)
x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++)
x=MM_findObj(n,d.layers[i].document); return x;
}

function MM_showHideLayers() { //v3.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null)
{ v=args[i+2];
if (obj.style) { obj=obj.style;
v=(v=='show')?'visible':(v='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
</head>

<body bgcolor="#FFFFFF">
<div id="layer1" style="position:absolute; width:691px; height:57px;
z-index:1; left: 10px; top: 115px; background-color: #FFFF00;
layer-background-color: #FFFF00; border: 1px none #000000; visibility:
hidden">Updated:
WEEKLY 1ST MORTGAGE METRICS/CAPACITY MEETING Mark Lefanowicz 3/1/2005
9:00:00
AM to 3/1/2005 9:45:00 AM</div>
<table border="0" cellspacing="0" cellpadding="0" bgcolor="#CCCC99"
width="700">
<tr>
<td width="175" bgcolor="#FFFFFF">&nbsp;</td>
<td colspan="16" class="border"><font color=#FFFFFF
size='5'><strong>Tuesday,
March 01, 2005</strong></font></td>
</tr>
<tr>
<td width="175" class="border">Room Name</td>
<td width="35" class="border">6a</td>
<td width="35" class="border">7a</td>
<td width="35" class="border">8a</td>
<td width="35" class="border">9a</td>
<td width="35" class="border">10a</td>
<td width="35" class="border">11a</td>
<td width="35" class="border">12p</td>
<td width="35" class="border">1p</td>
<td width="35" class="border">2p</td>
<td width="35" class="border">3p</td>
<td width="35" class="border">4p</td>
<td width="35" class="border">5p</td>
<td width="35" class="border">6p</td>
<td width="35" class="border">7p</td>
<td width="35" class="border">8p</td>
</tr>
<tr>
<td width="175" class="border">Bay</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border"><a href="#"
onMouseOver="MM_showHideLayers('layer1','','show') "
onMouseOut="MM_showHideLayers('layer1','','hide')" >R</a></td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
<td width="35" class="border">&nbsp;</td>
</tr>
</table>
</body>
</html>

Jul 23 '05 #13
Adrienne wrote:
Gazing into my crystal ball I observed "karlman" <ka*****@pacbell.net>
writing in news:11*********************@g14g2000cwa.googlegro ups.com:

I have uploaded my latest effort. If you hover over the colored areas
then you will see a popup that shows the meeting times. I am trying to
get them to line up properly with the times above. When I copy this
code into Dreamweaver it lines up perfectly...

My next effort will be to try doing it with images...

Thank you!!

http://www.geocities.com/uberkase/default.htm

Karl

I can see several problems with page.

First, take things like this: <TD style='border:solid 1px #000000'
width='35'> and turn it into this:
.times {border:solid 1px #000000; width:35px}
<td class="times">

You have other issues with nesting tables. That's always a bad idea, IMHO.
Keep everything in the same table.

I would not use the title attribute to describe the events. It might not
be available to the user long enough. Make the width and height of the
cell large enough to take a certain amount of character, and use only that
amount of character.

You would also be better off keeping the width of each cell the same,
regardless of whether the date is available or not.

I have an example calendar I made last year. You're more than welcome to
look at the source and CSS to see what I did:
<http://www.cavalcade-of-coding.info/usenet/calendar.html>

Nice example.
However it brings up something I've been wondering about. Is there a
place to get (download) a generic calendar for use on web pages? All I
want is the calendar display.
I'm probably going to end up writing my own calendar app but I'd prefer
not to reinvent the wheel any more than I absolutely have to.

--RC
Jul 23 '05 #14
Adrienne wrote:
I have an example calendar I made last year. You're more than welcome to
look at the source and CSS to see what I did:
<http://www.cavalcade-of-coding.info/usenet/calendar.html>


Nice looking calendar, Adrienne. May I suggest you add this to the CSS?

#calendar td {
vertical-align: top;
}

Looks a bit nicer than having the numbers floating about in different
positions, if there is text or not for the day.

--
-bts
-This space intentionally left blank.
Jul 23 '05 #15
Gazing into my crystal ball I observed "Beauregard T. Shagnasty"
<a.*********@example.invalid> writing in
news:38*************@individual.net:
Adrienne wrote:
I have an example calendar I made last year. You're more than welcome
to look at the source and CSS to see what I did:
<http://www.cavalcade-of-coding.info/usenet/calendar.html>


Nice looking calendar, Adrienne. May I suggest you add this to the CSS?

#calendar td {
vertical-align: top;
}

Looks a bit nicer than having the numbers floating about in different
positions, if there is text or not for the day.


You're right. Done.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Jul 23 '05 #16
Gazing into my crystal ball I observed Rick Cook
<rc****@TAKEOUT.mindspring.com> writing in
news:M5*****************@newsread3.news.pas.earthl ink.net:
I have an example calendar I made last year. You're more than welcome
to look at the source and CSS to see what I did:
<http://www.cavalcade-of-coding.info/usenet/calendar.html>

Nice example.
However it brings up something I've been wondering about. Is there a
place to get (download) a generic calendar for use on web pages? All I
want is the calendar display.
I'm probably going to end up writing my own calendar app but I'd prefer
not to reinvent the wheel any more than I absolutely have to.


Depending on what language you have available, I'm sure there's lots of
calendars available.

I'm going to have to do this myself as I have a client that wants to have
appointments available online. Now, I'm just going to have to figure out
how to get their existing appointment app to talk to the web based one, and
vice versa.

--
Adrienne Boswell
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Jul 23 '05 #17

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: P. Keyes | last post by:
I'm trying to get the css to render a border specific to a table row, but in Mozilla 1.3 and Netscape 7 nothing happens. Shows up fine in IE5. I haven't been able to find any info on this specific...
5
by: Josh Renaud | last post by:
I'm still trying to solve a problem I have experienced in Safari. This is my third post on the subject. I'm hoping someone can shed some light. The problem is that, in Safari, a table with no...
47
by: Neal | last post by:
Patrick Griffiths weighs in on the CSS vs table layout debate in his blog entry "Tables my ass" - http://www.htmldog.com/ptg/archives/000049.php . A quite good article.
1
by: dumblede | last post by:
Hello fellows, i would like to center a 800px wide 600px high content area without using frames. I have "come up" with the following solution so far. It works under IE 6.0, Firefox 1 (under...
5
by: Jean Pion | last post by:
Dear readers, Can anyone explain how to set column width of a table in ccs. I use the following style in an external stylesheet: table.tbl { table-layout:fixed; border-top: 5px solid #333;...
50
by: Shadow Lynx | last post by:
Consider this simple HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head>...
7
by: Daniel Kabs | last post by:
Hi there, for a long time I've been using tables to layout elements on a web page. Example: Say we have a 2x2 table and I'd like to put text (left aligned) and buttons (right aligned) in the...
4
by: Gabriel | last post by:
Which is the mistake? I need one column with different size. Thanks a lot. table { border: outset 2pt; border-collapse: separate; border-spacing: 4pt; background:black;
6
by: Tweety | last post by:
Hello, I need to display the current Web Browser's Width on my web page. I Tried Screen.width, but it is for the width of the Windows. I tried Window.width, but it doesn't work. What i want...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.