How to adjust table column width with CSS

HELLO.
Site that im working on , contains many products and each product has its own Specification table that are being imported into database. I need to change the column width of the table using CSS . i can not go to each product and change tables properties .. i used
td:nth-child(1) in the css file. using this i can change many properties in the table but width of the column is not changing ? would appreciate any info on this . bellow is the link to a page.
https://tekwar.ca/mfv-straight-flow-400ml-air-12ml-water-brass-metering-valves.html

 

That HTML is a total ****show. My advice would be to pitch it all in the trash and start over. Here's a tip, 99% of the time you see style="" slopped all over the markup, you're looking at developer ignorance, incompetence, and ineptitude. Much less the nonsense of declaring height on elements that don't even ACCEPT CSS heights. (why do people do this?!?)

You don't even have the proper semantics, since that first TD per TR should likely be a TH with SCOPE="ROW" on it.

Much the same could be said for those "DIV for NOTHING" surrounding it, more nonsensical/pointless height declarations, and the use of PX metrics telling users with accessibility needs to go f*** themselves.

There is ZERO reason for the markup of that section to be more than:

<table class="technicalSpecs">
	<tr>
		<th scope="row">Flow Pattern:</th>
		<td>Straight (T)</td>
	</tr><tr>
		<th scope="row">Body:</th>
		<td>Chrome Plated Brass</td>
	</tr><tr>
		<th scope="row">Valve Needle:</th>
		<td>316 Stainless steel</td>
	</tr><tr>
		<th scope="row">Orifice:</th>
		<td>316 stainless steel with PTFE liner for valve sizes 1, 2 and 3; PCTFE for valve sizes 4,5,6 and 7.</td>
	</tr><tr>
		<th scope="row">O-Rings:</th>
		<td>Buna-N®</td>
	</tr><tr>
		<th scope="row">Maximum Flow (mL/min):</th>
		<td>400ml Air - 12ml Water</td>
	</tr><tr>
		<th scope="row">Orifice Size:</th>
		<td>0.042 inch</td>
	</tr><tr>
		<th scope="row">CV:</th>
		<td>0.001</td>
	</tr><tr>
		<th scope="row">Maximum Pressure:</th>
		<td>500 psig (3792 kPa).</td>
	</tr><tr>
		<th scope="row">Maximum Temperature:</th>
		<td>180 °F (82 °C) -brass.</td>
	</tr><tr>
		<th scope="row">Valve Stem:</th>
		<td>Sixteen turns, non-rising type.</td>
	</tr>
</table>

Code (markup):

With everything else declared ONCE in your external stylesheet.

Again though, with that entire site being a giant middle finger to users with accessibility needs, you need to throw it ALL away before you get your tuchas sued off under laws like the US ADA or UK EQA. The content itself is fine, but the way that site is coded just tells large swaths of users to sod off!

Particularly if we start talking about the broken scripttardery that only further tells users to kiss themselves where the sun doesn't shine.

Hardly a shock that page you linked to is vomiting up 55k of markup for 1.4k of content and one content image -- not even 5k of HTML's flipping job! Goes hand in hand with the batshit ridiculous 2.5 MEGABYTES of JavaScript spread out over 200 separate files, and the equally derpy half a megabyte of CSS when NO legitimate website really needs more than 48k of the stuff.

It's a train wreck laundry list of how NOT to code a website. You'd almost think it was a vanilla magento install...

Apologies if that comes across as unduly harsh, but I figured SOMEBODY ought to tell you this so you can stop bending yourself over the counter.