Chrome Dev Tools: tracking down styles

Hope you gurus can answer some questions for me regarding my webpage and with reference to Chrome DevTools.  I will post more questions seperately:

1) What is responsible for setting the width of TD element with id="ee1" to 167px?
2) Why doesn't the width show up in the DevTools Styles pane (Version 30.0.1599.66 m)?
3) Width does show in Computed pane, but why doesn't it have an arrow to expand and see the relevant selectors?
4) How could I have used DevTools to answer these questions?

NOTE: I am looking for answers to my questions to better understand CSS; I've already resolved the problem (by setting the width on the TD element instead of on alt[img]).

Thanks-
Sam
Houses.htm
SAbboushiAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

GaryCommented:
The TD has no width set, the computed width is the TD's with as displayed - it is not set from anywhere

The rowspan setting for 8 works fine for me

Your table is trying to fit all the content but it cannot because of your set widths elsewhere.
You have set a width on the image and the table is trying to fit it into a cell that doesn't have 200px to spare.
0
SAbboushiAuthor Commented:
Hi Gary - thanks for your response.  I appreciate your help again.

the TD's width as displayed
Can you or someone else give me more on that?  

Your table is trying to fit all the content but it cannot because of your set widths elsewhere.

If you examine the width of the div containing the table, it is 932px

Now, if I disable the CSS Rules for img[alt] (height, width, min-width) and set the parent TD width to 200px (id="ee1"), the image fits just as I want-- and the resulting width of the parent div is still 932px (Note: the width of the rightmost TD "Clear Lake Area..." was reduced to compensate for the increased width I gave the TD containing the image).  

So I don't understand your response that the table cannot fit all the content because of the set widths elsewhere...?  Now it is fitting the way I want...

There is some calculation that is being performed that assigned a width of 167px to the TD with id="ee1".  I'm looking for someone who can explain how that was done.

The rowspan setting for 8 works fine for me
Hmmm... for me, the height of the "Year Built:" element increases from 20px to 36px when I set it to 8.  That doesn't happen for you?
0
GaryCommented:
Computed width is when the dev tools inspect the element and gets its size - I don't know how better to explain it. This is not a style that exists, it is just reading the dimensions as it is rendered in the browser - it's kinda like you counting the pixels and coming up with 167 pixels.
Yes 8 rows work, but I may have amended other code, I will have to look again.
I'll have a look at it again shortly.
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

GaryCommented:
On the 5th row you have an extra TD - I assume extra because it is taking up blank space for no reason.
Check your site in http://validator.w3.org/check
There are quite a few HTML errors and this will screw up the rendering e.g.
<td class="col_value_l">1966</></td>
There are several Col and Row counts that are off
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
SAbboushiAuthor Commented:
On the 5th row you have an extra TD - I assume extra because it is taking up blank space for no reason.
Looking at my notes on 1st empty TD element of TR (class="spacer1"): I need to create empty cells for col styling to color (i.e. background color)

Check your site in http://validator.w3.org/check
Sweet!  That alone was worth the price of admission! (i.e. very helpful -- thanks
0
GaryCommented:
Let me know when the errors are corrected then we can proceed from there.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.