[Pro] table cells and image? (timely help needed)

Barry_Hoffman · June 16, 2012, 12:51am

Hi,

If I have a table with 100 rows, and every 10 rows is a title (ex. Chemistry) Is it possible on just 1 row to have that cell FILL with an image and I can lay the word Chemistry over it?

In other words, can I have individual cells of tables have different background images in them?

Thanks,

Barry

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · June 16, 2012, 1:12am

If you use the Add Selector Action to add an ID or a classname to that cell, then you can target that with a tag-only style. Freeway’s Inspector doesn’t let you apply an image to a table cell, and I am not sure if the Extended dialog does what you need to insert it inline.

Walter

On Jun 15, 2012, at 8:51 PM, Hoffman wrote:

Hi,

If I have a table with 100 rows, and every 10 rows is a title (ex. Chemistry) Is it possible on just 1 row to have that cell FILL with an image and I can lay the word Chemistry over it?

In other words, can I have individual cells of tables have different background images in them?

Thanks,

Barry

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Barry_Hoffman · June 16, 2012, 1:16am

Walt, even if I accomplish this, i imagine it would not let me lay HTML text over it for a title in the table, would it?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · June 16, 2012, 1:27am

Of course it would. A background image does not displace anything, it’s behind everything except the background color.

Walter

On Jun 15, 2012, at 9:16 PM, Hoffman wrote:

Walt, even if I accomplish this, i imagine it would not let me lay HTML text over it for a title in the table, would it?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Barry_Hoffman · June 16, 2012, 1:29am

yes of course.

tx.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Tim3 · June 16, 2012, 10:25am

Hi Barry,
You can do this quite easily in Freeway by adding a custom class to the table row;

Select the table row you want to change by moving the cursor over the left edge of the table until the cursor changes to a black right arrow
Click. This should select the whole table row
In the Inspector palette click on the first tab (table cell settings) and open the Current Row section if closed
Click the extend button
Click New…
Add:
Name: class
Value: tabletitle
(you can add any value you like really but make sure there are no spaces, punctuation and avoid numbers)
Click OK twice to get back to your document

You can now add some CSS to style this table row;

Go to Edit > Styles
Click the plus (+) button to add a new style
In the Tag field enter .tabletitle (don’t forget the leading period)
Clear the Name field
In the character section add a background image to the style by selecting your image. Also set how it repeats over the table row.
Click OK
Publish or preview your page and you should see the background image in the table row you selected in step 1

You can now repeat steps 1 to 7 for all of the other table rows that you want to have the same background image.
Regards,
Tim.

FreewayActions.com - Freeware and commercial Actions for Freeway Express & Pro - http://www.freewayactions.com
FreewayStyle.com - Free Freeway templates and parts to download, use and explore - http://www.freewaystyle.com

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Barry_Hoffman · June 16, 2012, 11:27am

That is wild…thanks…
Will try today

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

David_McCallum · June 16, 2012, 1:22pm

Can you not insert an html item in your cell and apply a bg image to that?

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · June 16, 2012, 2:17pm

For even more magic, you can use the nth-child selector to apply the header behavior to every 10th row without having to add the class manually to those rows.

#yourTable tr:nth-child(10) {
    background: url(Resources/image name.gif);
    font-style: bold;
}

This will naturally fail in an elderly browser (or one from Washington State, where the lack of sunshine stunts their growth). But this lack of support will not keep the content from being visible. If IE is a huge part of your audience, you can use JavaScript to add the style.

Walter

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · June 16, 2012, 2:23pm

Hi Dave -

They are trying to style the table row (the html tag for which is ). An
easier way to style the background image of a table cell (html is )
would be to first create a normal class style (Name field in Style Editor,
not tag), then select each cell that you want to have that background and
apply it.

–
Ernie Simpson

On Sat, Jun 16, 2012 at 9:22 AM, DeltaDave email@hidden wrote:

Can you not insert an html item in your cell and apply a bg image to that?

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

David_McCallum · June 16, 2012, 3:41pm

They are trying to style the table row

I appreciate that but I am also aware of Barry’s knowledge level when it comes to editing styles/creating styles and he might be more comfortable with a simpler approach.

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Barry_Hoffman · June 16, 2012, 3:48pm

very true.

can we say “increasing” knowledge level at least.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Tim3 · June 16, 2012, 3:54pm

That is certainly something well worth remembering Dave, however Barry mentioned that he wanted to place the word chemistry over the top of the image which means it has to be done with a background image (or by overlaying the table over a regular image). Certainly if it weren’t for the text then placing an image in the table cell would also have done the job wonderfully well - and with a lot fewer steps.
Regards,
Tim.

On 16 Jun 2012, at 16:41, DeltaDave wrote:

I appreciate that but I am also aware of Barry’s knowledge level when it comes to editing styles/creating styles and he might be more comfortable with a simpler approach.

FreewayActions.com - Freeware and commercial Actions for Freeway Express & Pro - http://www.freewayactions.com
FreewayStyle.com - Free Freeway templates and parts to download, use and explore - http://www.freewaystyle.com

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

David_McCallum · June 16, 2012, 11:07pm

however Barry mentioned that he wanted to place the word chemistry over the top of the image

But you can have text in the html container too!

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

David_McCallum · June 16, 2012, 11:35pm

And to illustrate: http://www.deltadesign.co/fw_examples/textoveracell.html

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Barry_Hoffman · June 16, 2012, 11:40pm

very cool.

so which is the easiest directions and will I be able to FILL the cell with the picture and have text over it?

tx,

Barry

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

David_McCallum · June 17, 2012, 12:28am

will I be able to FILL the cell with the picture and have text over it?

Try it

Insert an html item into your table cell, apply a bg image to it (adjust the position using the tiling options) and then stick in some text. You will need to use some padding etc. to position your text but that shouldn’t be too difficult.

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · June 17, 2012, 12:42am

What you say is true, however I would point out that a table cell is also
an html container, just a different kind.

Table elements already have everything needed – they hold text and can be
styled with CSS. Inserting a container inside another container just to do
what can already be easily done is an unnecessary and inelegant solution.

–
Ernie Simpson

On Sat, Jun 16, 2012 at 7:07 PM, DeltaDave email@hidden wrote:

But you can have text in the html container too!

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

David_McCallum · June 17, 2012, 12:51am

just to do what can already be easily done is an unnecessary and inelegant solution

Easy for you and easy for me but not necessarily easy for Barry who is a science teacher and not a web developer.

Dont get me wrong - I think he is perfectly capable of increasing his knowledge of CSS and styling but he wants to get his site up and running and some of the niceties may come later.

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Barry_Hoffman · July 1, 2012, 6:14pm

Dave,

Thanks for you directions- I followed your simple directions- insert HTML then pict background!

so simple.

Barry

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options