tables in HTML editor

tables in HTML editor

by Hemant Karandikar -
Number of replies: 22
How to resize column or row widths in HTML tables?
Average of ratings: -
In reply to Hemant Karandikar

Re: tables in HTML editor

by Matt Molloy -

Hi Hemant,

In your editor, insert a table, then use the view toggle button to switch to html source view. There you will see values for the widths of the columns, just alter them to suit:

Attachment inserttablecodeview.jpg
In reply to Matt Molloy

Re: tables in HTML editor

by Hemant Karandikar -
Yes, I worked.

Since I am not in HTML programming (I developing training content) I am bit apprehensive about code changes.

Thanks for the help.

Hemant
In reply to Hemant Karandikar

Re: tables in HTML editor

by A. T. Wyatt -
You can also go to the full screen editor (very last right-hand button on second row of toolbar) and then you can find the table tools. You might find something there as well!

atw
In reply to A. T. Wyatt

Re: tables in HTML editor

by Hemant Karandikar -
Thanks.
Yes, I tried full screen editor, but could not locate any method for resizing columns or rows. Nor I could figure out ways to format rows or columns (e.g. to impart a background color).

Hemant
In reply to Hemant Karandikar

Re: tables in HTML editor

by A. T. Wyatt -
Well, I have been known to use another tool such as Dreamweaver to create what I want and then copy and paste that code to the html editor code window. It usually works fairly well! But remember you have a 256K limit. If you go beyond that, my recollection is that the content is truncated/not saved.

Would it work better for you to add this content as a link rather than use the html editor?

atw
In reply to Hemant Karandikar

Re: tables in HTML editor

by Jim McGregor -

In the Fullscreen editor mode, you choose the cell properties button to set column widths, background and text colors etc. Safest to stay out of the html if you're not sure of it.

In reply to Jim McGregor

Re: tables in HTML editor

by Sónia Noronha -

Hi, everyone,

I've tried formatting tables in the HTML editor using the table properties button, but I can't figure out a way of saving the changes. So, after I set the properties I want, I close the table properties box, but the table looks exactly as it did before... sad

Can anyone help me?
Thanks!

In reply to Sónia Noronha

Re: tables in HTML editor

by Sónia Noronha -

Hi again!

Please ignore my request for help... I don't know why but my table properties box was opening in such a size that the OK button wasn't visible... shy

Thanks.

In reply to Hemant Karandikar

Re: tables in HTML editor

by Chris Gillies -
Hi Everyone,

On a related note I am really struggling to get the HTML editor to recognise table height settings. I have tried to use the enlarge editor view and also the table properties but to no avail.

I have got a really enthusiatic member of staff who wants to create hot spots with pictures and tables and I really dont want to let her down. Any help would be massively appreciated.

Thanks
In reply to Chris Gillies

Re: tables in HTML editor

by Itamar Tzadok -
100px X 100px table

 


<table width="100px" height="100px" border="1"><tbody>
<tr>
<td valign="top">&nbsp;
</td>
</tr></tbody>
</table>
In reply to Chris Gillies

Re: tables in HTML editor

by Steve Hyndman -

The Moodle editor is not all that great when it comes to working with tables. So, unless you are really good with html, I've found it is a lot easier to create tables offline using something like FrontPage and then copy/paste the code in Moodle. I'm working on training videos this morning, so since I have everything set-up, I took a couple of minutes to show you how I do tables for use in Moodle.

Here is the table:

 gewgweg
   gwegw
   wgw  
 
 gew  
    wegw 

Here is how I created it:

http://www.kentuckyclassroom.com/table/table.swf

Steve

In reply to Steve Hyndman

Re: tables in HTML editor

by Chris Gillies -
Thanks for the quick responses. However I am still struggling, see the attached picture.

I copied the code that Itamar posted and put two slices of an image inside the table with the hope that the table height would force them together. I even set the table height to the exact combined height of the two images yet still no success.

I did notice that the "px" at the end of "width="100px" height="100px" was disapearing from the HTML view whenever I returned to it after saving. I am not sure if that could be part of the reason for the failure. Also thanks for the video I will have a go at creating some HTML in frontpage tonight and see if that works.
Attachment Table_Height_problem.jpg
In reply to Chris Gillies

Re: tables in HTML editor

by Itamar Tzadok -
Well, element's dimensions in HTML usually don't force anything on the content of the element. But that gap between the images is really irritating. I don't know why the images are rendered that way despite their settings and I'll try to find out. There might be a simple explanation for that. thoughtful
The obvious quick workaround is to make one image from the two but that might not be very effective if there are lots of other parts where these two come from. Absolute positioning may also solve the problem but that's a pain. So we'll have to look for something else.
In reply to Chris Gillies

Re: tables in HTML editor

by Mauno Korpelainen -

The problem is not necessarely in editor - check also theme css. There may be for example some body level margin or padding for <img> causing the cap.

In reply to Mauno Korpelainen

Re: tables in HTML editor

by Itamar Tzadok -
Yes, I thought about that too but since I don't have access to the css I tried setting the padding and margin of the img to 0 which worked on another environment but not on Moodle. By the way the editor indeed doesn't seem to be the problem because it displays the images properly and the gap appears only when the images are displayed on the page.

1
2
In reply to Itamar Tzadok

Re: tables in HTML editor

by Chris Gillies -
Sorry I should have mentioned that as Itamar noted the pictures look fine within the editor its only when viewed outside of the editor that horizontal gaps appear.

Unfortunately copying the HTML from Frontpage or Dreamweaver doesnt seem to help. It looks fine in them but once the HTML is in a Moodle course the dreaded horizontal gaps re-appear.

I am not sure if this is along the lines of what you meant Mauno but I have also tried some different themes but have noticed no discernible difference.

One useful thing I have discovered is that the gaps disappear when viewing the course in IE6, its just a shame our college uses Firefoxmixed.

In reply to Chris Gillies

Re: tables in HTML editor

by Steve Hyndman -

Well, this isn't a fix for the horizontal gap in the table, but I'm not sure why you are splitting a 100px high image anyway. Why not just include it as a single image?

Steve

In reply to Chris Gillies

Re: tables in HTML editor

by Mauno Korpelainen -

This seems to be a firefox browser bug - one solution is to use style="display: block;" and no <br> tags between images. Tested in all browsers and works like in menus where you do not want to leave caps between rows. Like this:

<table>
<tbody>
<tr>
<td><img src="address of image 1" style="display: block;" /><img src="address of image 2" style="display: block;" /></td>
</tr>
</tbody>
</table>

Average of ratings: Useful (1)
In reply to Mauno Korpelainen

Re: tables in HTML editor

by Chris Gillies -
Brilliant, thats fixed it, thanks Mauno and everyone else that helped out.
In reply to Chris Gillies

Re: tables in HTML editor

by Michael Powers -
I know this is going to sound really ignorant, but on my moodle it doesn't even show a html editor box! All it has is the editing box buttons on the bottom of the page. Help me, I'm new to this. blush