Tables have a mind of their own !!!!!!!!!!

Tables have a mind of their own !!!!!!!!!!

by Hansruedi (Lori) Lorenz -
Number of replies: 3

I am just about loosing it angry  (Moodle 1.9)

I try to insert a table with two columns. First column 300 pixel wide, second as wide as the space allows.

I can do this, but it displays very differently once it is saved. The first box is about 70% and the second box is the remainder. (see attched screen shot) 

Also the text in the Html editor is to the left, but once it is saved it is centred. (no screen shot)

I tried in different browsers, but had no luck either. I also tried to draw the table in a different Html Editor and cut and past it,   ……………. but no it just does not like it. 

 

Average of ratings: -
In reply to Hansruedi (Lori) Lorenz

Re: Tables have a mind of their own !!!!!!!!!!

by Colin Fraser -
Picture of Documentation writers Picture of Testers

It would work better for me if you were to paste the actual code you are working with, the image means nothing really. I suggest what is happening is that the first column imposes its own value and the second is taking up only what it needs, therefore the first column extends to cover any width the second column does not need.

However, Moodle is subject to the same rules as every other page writing html, it might do some funny things occasionally, but they are within the same rules.  Try this:

<table width="75%">
<tr>
<td width="300px>blah</td>
<td width = "100%">blah blah</td>
</td>
</table>

Edit the values manually, it works better..smile The second column should take 100% of the residual width - well that is what happens for me, and that is my explanation of what I think is actually happening. 

Average of ratings: -
In reply to Colin Fraser

Re: Tables have a mind of their own !!!!!!!!!!

by Hansruedi (Lori) Lorenz -

Thank you so much Colin.

I am lost without the Html editor, but still tried to follow your instruction.

The table is now smaller, but ultimately not much has changed. Obviously I do not understand what I am doing. I have pasted the code of the table (I hope)

<table cellspacing="0" cellpadding="4" border="1" width="70%"><tbody>
<tr valign="TOP">
<td width="300px">
<p class="western"><img hspace="0" height="300px" border="0" width="300px" vspace="0" src="../file.php/138/Safety-Signs.jpg" alt="Workplace safety" title="Workplace safety" /> </p>
<p> </p>
</td>
<td width="100%">
<p> </p> <br />
<p>In this module you learn:<br /> </p>
<div style="background-color: transparent;">
<div style="background-color: transparent;"><b style="font-weight: normal;" id="internal-source-marker_0.5462387260049582">
<ul>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>Cost of accidents</span></li>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>Type of accidents</span></li>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>Near misses</span></li>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>Risk assessments</span></li>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>Most common accidents and how to prevent them</span></li>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>How to deal with isocyanide</span></li>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>Fires</span></li>
<li style="list-style-type: disc; font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 15px; font-family: arial; color: rgb(0, 0, 0); background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;"> <span style="white-space: pre;" class="Apple-tab-span"> </span>Your obligations</span></li>
</ul></b></div></div>

Any help is greatly appreciated 

Cheers Lori

Ps: I cooled down again smile


Average of ratings: -
In reply to Hansruedi (Lori) Lorenz

Re: Tables have a mind of their own !!!!!!!!!!

by Colin Fraser -
Picture of Documentation writers Picture of Testers

I changed the cell size to 308px as you have 4px cellpadding and it seemed to work first up, but I am using a 1680x1050 resolution. How does that compare to yours? What would happen if you reduced the image size to 250px square? Also, the ratio of code to text is incredibly high, so is it possible that could be influencing the table structure? 

Average of ratings: -