On Sep 9, 2009, at 9:04 AM, Christopher Barth wrote:
> On a site I'm modifying I have an image that needs to always appear at
> the bottom of a column, so I set the valign on the table cell to
> bottom
> and all was wonderful until I was asked to put images in the bar as
> well
> and the images need to appear at the top of the column.
>
> You can see what I mean here:
> http://wynright.com/gsa2/Handling_Equipment/Conveyors/.
>
> On the left of the main body text there is a column under the menu. In
> that column there are three buttons which need to appear directly
> under
> the menu and there is a gray background fade which needs to appear at
> the bottom of the column always. The other catch is that the gray bar
> must always show in its entirety even if there is no or little text in
> the body in order to give the page some substance.
>
> With the valign set to bottom my positing is artificially lowered.
> If I
> take that off I can't figure out how to lower the background
> gradient to
> the bottom of the column. Suggestions?
Don't insert that gradient image as an <img>, use background-image
instead.
Something like this ought to work:
1. give that td an ID (#myID - but give it a more meaningful one…)
2. #myID {background: transparent url(path/to/myGradient.png) repeat-x
bottom center;}
3. remove that 'valign' attribute
4. insert you icon-images
<td id="myID"><img src="" alt=""> ...
PS don't use inline style if you can avoid it. It is a mess to maintain.
Philippe
---
Philippe Wittenbergh
http://l-c-n.com/
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
