Hi Karl - thanks. This doesn't work for me in IE. Did you see it working there?
Sara On Nov 16, 2013, at 7:58 PM, Karl DeSaulniers <[email protected]> wrote: > > On Nov 13, 2013, at 3:02 PM, Sara Haradhvala wrote: > >> Would really appreciate a suggestion and explanation from this group. >> >> I'd like to align a link at the bottom of a table cell. The rest of the text >> should be aligned at the top of the cell. I'd also like to leave some >> padding above the link so that I can reduce the width of the window and >> there's room for the link to wrap to become 3 short lines rather than 1 long >> line without bumping into the text. I'd like the cell sizes to be variable >> if at all possible. >> >> Is this possible in all browsers? I got it to work in Firefox as follows, >> but in Chrome and IE, the div doesn't grown to 100%. If I switch Chrome to >> box-sizing:content-box, it works - but that doesn't work in Firefox. And >> neither box-sizing works in IE. >> >> <table border="1"> >> <tr> >> <td> >> <div>Lorem Ipsum is simply dummy text of the printing and >> typesetting industry. Lorem Ipsum has been the industry's standard dummy >> text ever since the 1500s, when an unknown printer took a galley of type and >> scrambled it to make a type specimen book. It has survived not only five >> centuries, but also the leap into electronic typesetting, remaining >> essentially unchanged. It was popularised in the 1960s with the release of >> Letraset sheets containing Lorem Ipsum passages, and more recently with >> desktop publishing software like Aldus PageMaker including versions of Lorem >> Ipsum. <a href="#">link</a> >> >> </div> >> </td> >> <td> >> <div>Small amount of text <a href="#">link</a> >> >> </div> >> </td> >> </tr> >> </table> >> >> * { >> box-sizing:content-box; >> -moz-box-sizing:border-box; >> } >> table, tr, td, div { >> height:100%; >> } >> table { >> border-collapse:collapse; >> } >> td { >> vertical-align:top; >> } >> div { >> position:relative; >> padding-bottom:60px; >> } >> a { >> position:absolute; >> bottom:0; >> display:block; >> } > > > Hi Sara, > Is this what your talking about? > > http://designdrumm.com/test.zip > > This was a fluid layout template from dreamweaver with your html added to. > I am not positive from your description that this is what your looking for. > May still need some media queries of your own added though. > HTH, > > Best, > Karl > ______________________________________________________________________ > 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/ ______________________________________________________________________ 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/
