What is the best way to modify the inline style width of a table td from pixels to percentage in order to make it

<table>
 <tr style="height:15pt;">
      <td style="width:229pt;border-style:solid;border-width:0pt;padding:3pt 9pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"><p style="font-family:Times New Roman, serif;font-size:10pt;font-style:normal;font-variant:normal;text-indent:-14pt;margin:0 0 0 14pt;" align="left">Compensation: </p></td>
      <td style="width:33pt;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
      <td style="width:6pt;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
      <td style="width:33pt;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
      <td style="width:32pt;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
    </tr>
</table>

Looking to change the "PT" width style to percentages in order to fit all screen resolutions.

javascriptjqueryhtmlcss

Answer №1

table{width:100%}
<table>
 <tr style="height:15pt;">
      <td style="width:68%;border-style:solid;border-width:0pt;padding:3pt 9pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"><p style="font-family:Times New Roman, serif;font-size:10pt;font-style:normal;font-variant:normal;text-indent:-14pt;margin:0 0 0 14pt;" align="left">Compensation: </p></td>
      <td style="width:10%;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
      <td style="width:2%;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
      <td style="width:10%;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
      <td style="width:10%;border-style:solid;border-width:1pt 0pt 0pt 0pt;padding:3pt 0pt 3pt 0pt;" valign="bottom" bgcolor="#c0c0c0"></td>
    </tr>
</table>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How to eliminate spaces while preserving line breaks in a textarea using JS or jQuery

I have been trying to figure out how to remove extra spaces from the beginning and end of lines while keeping the line breaks intact. Here's what I attempted: function removeSpaces(string) { return string.split(' ').join(''); } ...

javascriptjquerytextareawhitespaceextra

Ways to eliminate spacing from a bullet point in a list?

Is there a way to eliminate indentation from ul? I attempted adjusting margin, padding, and text-indent to 0, but with no success. It appears that setting text-indent to a negative value works - but is this the only solution for removing the indentation? ...

htmlcss

Can anyone recommend a user-friendly JavaScript dialog box compatible with jQuery that is mobile-responsive?

Mobile browsers. Using Jquery dialog alert box. Avoiding the use of alert() due to its unattractive appearance in web browsers. In the process of creating a website for both mobile and web platforms, seeking a dialog box that is compatible with both. ...

javascriptjquerycssbrowsermobile

Modify the collapse orientation in Bootstrap

I would like the button to expand from the bottom when clicked and collapse back down, instead of behaving like a dropdown. <head> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_ ...

javascriptcssbootstrap-5

What is the best way to display a div beneath the highlighted text within a textarea field?

I have encountered a situation where I want to display a div (like a popup) when text is selected in a text area. However, when using mouse-down for this action, the position of the div sometimes does not align directly below the selected text. Below is t ...

javascriptjquerycss

Limit the maximum height of a list within a fluid-width content container

I came across this link The layout works fine when the elements are limited in the #commentWrapper, but adding more items pushes everything downwards. Copying additional <li>test</li> items clearly demonstrates the issue. I want the input box ...

jqueryhtmlcssheightfluid-layout

The margin-bottom property does not cause the element to shift or re

Need help with creating a 3-line effect using div and before/after selectors. When applying margin-top in the after selector, the line moves down properly. However, when trying to move the line up using margin-bottom in the before selector, it's not w ...

htmlcss

Utilizing jQuery's Chained Selectors: Implementing Selectors on Previously Filtered Elements

DO NOT MISS: http://jsfiddle.net/gulcoza/9cVFT/1/ LATEST FIDDLE: http://jsfiddle.net/gulcoza/9cVFT/4/ All the code can be found in the above fiddle, but I will also explain it here: HTML <ul> <li id="e1">1</li> <li id="e2" ...

javascriptjqueryhtmljquery-selectors

Utilize JQuery to identify and select every parent element, then retrieve the height of the first child element and adjust the height of the

Recently, I developed a PHP script that pulls news and case posts from a database. The HTML structure used for displaying these posts is as follows: <a href='/post/placeholder'> <div class='col nopadding col12-12 counter'> ...

javascriptjqueryhtmlheightresponsive

Canvas with a button placed on top

I am working with a canvas and trying to position an HTML element over it using CSS. My goal is for the button to remain in place on the canvas even when resizing the entire page. Here is the code I am currently using. https://jsfiddle.net/z4fhrhLc/ #but ...

javascripthtmlcss

Steps for removing an item from an array in MongoDB

Is it possible to remove an object from the mainList array? _id:ObjectId("5fafc5aec2b84c301845c55a"), username:"test", mainList:[ { _id:ObjectId("5fafdf1a5b49510c789af0ae"), n ...

javascriptmongodbexpressmongoose

"Encountered an error: File or directory not found while attempting to export a function

src/test.js module.exports.test = function() { const { readFileSync } = require('fs'); console.log(readFileSync('test.txt', 'utf8').toString()) } index.js const { test } = require('./src/test.js'); test(); ...

javascriptnode.js

Node.js SQLite3 - DB.each() not running the subsequent code block

When running the code snippet below, I am getting the following output: var db = new sqlite3.Database("database.sqlite") console.log("2") db.each("SELECT * FROM gban WHERE id = '"+id+"'", async functi ...

javascriptnode.jsdatabasenode-sqlite3

Extract content from an HTML form within a specific cell using Cheerio

A sample HTML table is displayed below: <tr class="row-class" role="row"> <td>Text1</td> <td> <form method='get' action='http://example.php'> <input type='hidden' ...

javascripthtmlnode.jshtml-tablecheerio

Calculating JS functions before images are loaded

Following up on a previous question, I am utilizing JavaScript code from another article to position a "content" div relative to a fixed div in my project. However, the issue arises when the positioning of the "content" div is calculated only after all the ...

javascriptjqueryhtml

What is the best way to adjust the size of a background image on Safari

Using Chrome When using Chrome, the functionality is just like what's depicted in the image above. However, when using Safari The issue arises, as it does not work as expected in Safari. See below for the CSS code: background-image: url(r ...

htmlcssimagesafariresize

Altering the submit button's value following the submission of a form

My goal is to create a form with a submit button that, when clicked, will insert the value of the button into a database and change the text on the button to inserted. If the insertion violates any constraints, then the text on the button should be changed ...

phphtmlajax

How can I ensure a header is displayed on each page by utilizing CSS or JavaScript/jQuery?

On a lengthy page with approximately 15 pages of text, I would like to insert a header at the beginning of each page when the document is printed by the user. Can this functionality be achieved using CSS or JavaScript/jQuery? ...

javascriptjquerycss

Menu options arranged vertically, revealing submenus that fly out upon mouse hover

I am attempting to develop a vertical menu with flyouts, which includes sub-menus. Can you point out any issues in the code provided below? <html> <head> <title>Untitled Document</title> <style type="text/css ...

htmlcsssubmenu

Circular graphs displaying percentages at their center, illustrating the distribution of checked checkboxes across various categories

Looking for a JavaScript script that displays results in the form of circles with percentage values at their centers, based on the number of checkboxes checked in different categories. The circle radius should be determined by the percentage values - for e ...

javascriptjquerycss