/

HTML / CSS / JavaScript Tutorial

HTML Standard attribute: width

[this page | pdf | back links]

The HTML width attribute indicates the width of an element. It applies to <canvas>, <embed>, <iframe>, <img>, <input>, <object> and <video> elements.

 

Valid attribute values (when used with <canvas>, <embed>, <iframe>, <img>, <input>, <object> and <video> elements) include:

 

Value

Description

number

Width of element or embedded content in pixels, e.g. width="20"

percentage

Width as a percentage of surrounding element, e.g. width="30%"

 

Note: for some browsers and for some (but not all) of the elements listed above it appears to be necessary if the width is being set in JavaScript to set it using the CSS width property, e.g. in the form element.style.width = "20px" rather than using the width attribute.

 

EXAMPLE:


HTML USED IN THIS EXAMPLE:
<!DOCTYPE html>
<html> <!-- Copyright (c) Nematrian Limited 2018 -->
<head></head>
<body>
Created using HTML:<br>
<img src="Pictures/Shape1.jpg" width="70"><br>

<br><br>Created using JavaScript:<br>
<span id="element"></span>

<script>
var x = document.createElement("IMG");
var att1 = document.createAttribute("src");
att1.value = "Pictures/Shape1.jpg";
x.setAttributeNode(att1);
var att2 = document.createAttribute("width");
att2.value = "70";
x.setAttributeNode(att2);
document.getElementById("element").appendChild(x);
</script>

</body>
</html>


NAVIGATION LINKS
Contents | Prev | Next | HTML Attributes


Desktop view | Switch to Mobile