no, not exactly. if the div contains a long email or url with no spaces-the div will expand beyond the intended width set for the "td" and essentailly break the table layout. What i am trying to achieve is to place the actual "td" content in a "div" and have the "div" (1) inherit the parent td width, with (2)overflow: hidden. I have already given the overflow property in the stylesheet. I am thinking I need to have js that will automatically give any nested "div" the width of its parent.
in my sample http://www.roxstyle.com/projects/blssi/cms/user-tools-v1/user-search.html if you click on the "search" for the user tab (default tab)- there is a result table with sample content like this. in row one- the content for the third cell expands. in row two- the content has an inline style for the width, and in this case the content "cuts off" at this width. i hope this makes sense, i am more css/html experienced than js experiened. i would appreciate any help, if i am not explaining the intended behavior On Jan 7, 1:10 am, peet <[email protected]> wrote: > isn't that not the same as setting "width:100%" to all childs? > > On Jan 7, 2:42 am, roxstyle <[email protected]> wrote: > > > I have a table where each td has its width declared in css rules. > > Inside some "td" i have either "p" or "div" > > I want to have these elements inherit the width of the parent td. > > I have a sample here > > -http://www.roxstyle.com/projects/blssi/cms/user-tools-v1/user-search.... > > if you click on the "user" search, you will get a results table and > > several of the td have got purposely long (non-spaced text) > > the tds have a width within css, but the div does not inherit that. If > > i give the div the pixel width, with overflow:hidden - i get the > > results i want -the table structure stays in place and the extra text > > is hidden > > i would like to make a function that would globally give the css width > > of each td to its children > > > im trying things like: > > $(document).ready(function(){ > > var d = (".tbl tbody td div"); > > var d_p = $("d").parent('td'); > > function inheritWidth() { > > $("d").width(d_p.innerWidth()); > > } > > > }); > > > i know my knowledge of js is basic. Is there any tutorial, or a sample > > on the jquery site that is similar to this functionality i am looking > > for?
