HTML | Width Attribute - GeeksforGeeks

Trang chủ » Html Th Set Column Width » HTML | Width Attribute - GeeksforGeeks

Có thể bạn quan tâm

Skip to content geeksforgeeks
  • Courses
    • DSA Courses
    • Programming Languages
  • Tutorials
    • Python Tutorial
      • Python Loops and Control Flow
    • Java
      • Java Interview Questions
      • Java Quiz
      • Advance Java
    • Programming Languages
    • System Design
    • Interview Corner
    • Computer Science Subjects
    • DevOps
    • Linux
    • Software Testing
    • Databases
    • Android
    • Excel
    • Mathematics
  • DSA
    • Data Structures
    • Algorithms
      • Analysis of Algorithms
      • Searching Algorithms
      • Sorting Algorithms
    • Practice
      • Company Wise Coding Practice
      • Practice Problems Difficulty Wise
      • Language Wise Coding Practice
      • Curated DSA Lists
    • Company Wise SDE Sheets
    • DSA Cheat Sheets
    • Puzzles
  • Data Science
    • Data Science Packages
    • Data Visualization
    • Data Analysis
  • Web Tech
    • Web Development Using Python
      • Django
      • Flask
    • Cheat Sheets
  • HTML Tutorial
  • HTML Exercises
  • HTML Tags
  • HTML Attributes
  • Global Attributes
  • Event Attributes
  • HTML Interview Questions
  • HTML DOM
  • DOM Audio/Video
  • HTML 5
  • HTML Examples
  • Color Picker
  • A to Z Guide
  • HTML Formatter
▲ Open In App HTML <th> width Attribute Last Updated : 16 Sep, 2024 Summarize Comments Improve Suggest changes Like Article Like Save Share Report Follow

The HTML <th> width Attribute is used to specify the width of a table header cell. If the width attribute is not set then it takes the default width according to the content.

Syntax:

<th width="pixels | %">

Attribute Values:

Attributes values

Description

pixels

It sets the width of the table header cell in terms of pixels.

%

It sets the width of the table header cell in terms of percentage (%).

Example: In this example the <th> width attribute in this HTML example specifies the width of each table header cell in percentages. It adjusts the columns’ widths to 50%, 20%, and 30% of the table’s width.

HTML <!DOCTYPE html> <html> <head> <title> HTML th width Attribute </title> </head> <body> <h1>GeeksforGeeks</h1> <h2>HTML th width Attribute</h2> <table border="1" width="500"> <tr> <th width="50%">NAME</th> <th width="20%">AGE</th> <th width="30%">BRANCH</th> </tr> <tr> <td>BITTU</td> <td>22</td> <td>CSE</td> </tr> <tr> <td>RAKESH</td> <td>25</td> <td>EC</td> </tr> </table> </body> </html>

Output:

Example: In this example we use the <th> width attribute to set specific widths for table headers: 100 pixels for “Header 1” and 200 pixels for “Header 2,” with “Header 3” taking the remaining space.

HTML <!DOCTYPE html> <html> <head> <title>Table with th Width Attribute</title> <style> body{ display:flex; justify-content:center; align-items:center; flex-direction:column; } </style> </head> <body> <h1 style="color: green;">GeeksforGeeks</h1> <table border="1"> <tr> <th width="100">Header 1</th> <th width="200">Header 2</th> <th>Header 3</th> </tr> <tr> <td>Data 1</td> <td>Data 2</td> <td>Data 3</td> </tr> </table> </body> </html>

Output:

Screenshot-2023-12-18-173919

Output

HTML <th> width Attribute – FAQs

Does the <th> width attribute affect the entire column?

Yes, setting the width on a <th> typically affects the corresponding column’s width throughout the table.

What units can be used with the <th> width attribute?

The <th> width attribute accepts units like pixels (px) and percentages (%), but using CSS is preferred.

How does the <th> width attribute behave in different browsers?

The width attribute is deprecated but still generally supported for backward compatibility, though CSS offers more consistent control.

Can I set different widths for multiple <th> elements?

Yes, each <th> can have a unique width attribute value, but it’s better to use CSS for uniformity.

Can I use percentages in the <th> width attribute?

Yes, you can specify widths in percentages (e.g., width=”50%”), making columns responsive to table size.

Why is the <th> width attribute not recommended?

It’s deprecated in HTML5, and using CSS provides better control and styling consistency across different browsers.

author jit_t Follow Improve Next Article HTML <td> width Attribute

Similar Reads

  • HTML <th> width Attribute The HTML <th> width Attribute is used to specify the width of a table header cell. If the width attribute is not set then it takes the default width according to the content. Syntax:<th width="pixels | %">Attribute Values:Attributes values Description pixels It sets the width of the tabl 2 min read
  • HTML <td> width Attribute The HTML <td> width attribute was traditionally used to specify the width of a table cell. If this attribute is not set, the cell automatically adjusts its width based on the content it contains. This attribute provides flexibility as it accepts values in both pixels and percentages, allowing 3 min read
  • HTML | <pre> width Attribute The HTML <pre> width Attribute is used to specify the maximum number of characters per line. Note: The width Attribute is not supported by HTML5 Syntax: <pre width="number"> Attribute Values: number: It is used to set the maximum number of characters. Example: <!DOCTYPE html> <h 1 min read
  • HTML <table> width Attribute The HTML <table> element's width attribute specifies the width of the table. It can accept values in pixels or percentages. However, in HTML5, it is recommended to control table width using CSS instead. Syntax<table width="pixels | %">Attribute Valuespixels: It sets the width of the tabl 2 min read
  • HTML <object> width Attribute The HTML <object> width attribute is used to specify the horizontal dimension of the embedded object, defining the width of the displayed content within the webpage. Syntax: <object width="pixels">Attribute Values: pixels: It holds the width of the object in terms of pixels.The below exa 1 min read
  • HTML | <input> width Attribute The HTML <input> width Attribute is used to specify the width of the <input> element. This Attribute is only used for input type="image". Syntax: <input width="pixels"> Attribute Values: It contains the value i.e pixels which specify the width of the input Element. Example: C/C++ C 1 min read
  • HTML <video> width Attribute HTML <video> width Attribute is used to specify the width of the video display area in pixels of its container element's width. Note: Always specify the width and the height of the video else the web page will be confused about how much space that video will require due to that reason web page 1 min read
  • HTML | <col> width Attribute The HTML <col> width Attribute is used to specify the width of a column element. If width attribute is not set then it takes default width according to content. It is not supported by HTML 5. Syntax: <col width="pixels | % | relative_length"> Attribute Values: pixels: It sets the width o 1 min read
  • HTML <img> width Attribute Width attribute in HTML <img> tags specifies the width of the image element in pixels or as a percentage of its containing element's width, controlling its visual size on the webpage. Syntax: <img width="pixels">Attribute Values: They contain single value pixels which specify the width o 1 min read
  • HTML | <embed> width Attribute The HTML embed width attribute is used to specify the width of the embedded content. Syntax: <embed width="pixels"> Attribute Values: pixels: The width of embed value are set in terms of pixels. It is used to specify the width of embedded content. Example: C/C++ Code &lt;!DOCTYPE html& 1 min read
  • HTML | <th> valign Attribute The HTML <th> valign Attribute is used to specify the vertical alignment of text content in a header cell. It is not supported by HTML 5. Syntax: <th valign="top | middle | bottom | baseline"> Attribute Value: top: It sets the table header content to top-align. middle: It sets the table 1 min read
  • HTML | <iframe> width Attribute The HTML <iframe> width attribute is used to specify the width of the <iframe> in terms of pixels. Syntax: <iframe width="pixels"> Attribute Values: It contains single value pixel which specifies the width of the iframes in terms of pixels. Below example illustrates the use of < 1 min read
  • HTML <canvas> width Attribute The HTML <canvas> width Attribute is used to specify the width of the <canvas> in terms of pixels. Syntax: <canvas width="pixels"> Attribute Values: It contains the value i.e pixels which specify the width of the canvas in terms of pixel. It has a Default value which is 300. Exampl 1 min read
  • HTML | <th> scope Attribute The HTML <th> scope Attribute is used to specify the header cell is used for header row, column, colgroup or rowgroup. This attribute does not display any visual effect on the browser but it is used for screen readers. Syntax: <th scope="col | row | colgroup | rowgroup"> Attribute Values 1 min read
  • HTML <colgroup> width Attribute The HTML <colgroup> width Attribute is used to specify the width of the colgroup element. The <colgroup> attribute sets a predefined width of the column group. Syntax<colgroup width="pixels|%|relative_lngth">Attribute ValuesValue Description pixels It specify the width of the colgr 1 min read
  • HTML5 MathML width Attribute This attribute is used to set the width or increase/decrease the width of the content. This attribute is accepted by <mglyph>, <mpadded>, <mspace>, and <mtable> tags. Syntax: <element width="length"> Attribute Values: length: Holds the digit in specific unit, that much 1 min read
  • HTML <th> char Attribute The HTML <th> char attribute is used to specify the alignment to the character of content in a table header cell. It only contains the char align attribute. Its default value is a decimal point for page language. Note: It is not supported by HTML5. Syntax: <th char="character"> Attribute 1 min read
  • HTML | <th> abbr Attribute The HTML <th> abbr Attribute is used to specify the shorter version of content in header cell. It does not describe any visual effect but it is used by screen readers. Syntax: <th abbr="text"> Attribute Values: text: It contains the short description of header cell content. Example: C/C+ 1 min read
  • HTML | <td> char Attribute The HTML <td> char Attribute is used to specify the alignment to the character of content in a table cell. This attribute only contains char align attribute. Its default value is a decimal point for page language. It is not supported by HTML 5. Syntax: <td char="character"> Attribute Val 1 min read
  • HTML | <td> abbr Attribute The HTML <td> abbr attribute is used to specify the shorter version of the content. This attribute is not supported by HTML 5. It does not describe any visual effect but it is used by screen readers. Syntax: <td abbr="text"> Attribute Values: text: It contains the short description of ce 1 min read
Article Tags :
  • HTML
  • Web Technologies
  • HTML-Attributes
Like three90RightbarBannerImg Explore More We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy Got It ! Lightbox Improvement Suggest changes Suggest Changes Help us improve. Share your suggestions to enhance the article. Contribute your expertise and make a difference in the GeeksforGeeks portal. geeksforgeeks-suggest-icon Create Improvement Enhance the article with your expertise. Contribute to the GeeksforGeeks community and help create better learning resources for all. geeksforgeeks-improvement-icon Suggest Changes min 4 words, max CharLimit:2000

What kind of Experience do you want to share?

Interview Experiences Admission Experiences Career Journeys Work Experiences Campus Experiences Competitive Exam Experiences

Từ khóa » Html Th Set Column Width