
- Javascript Basics Tutorial
- Javascript - Home
- Javascript - Overview
- Javascript - Syntax
- Javascript - Enabling
- Javascript - Placement
- Javascript - Variables
- Javascript - Operators
- Javascript - If...Else
- Javascript - Switch Case
- Javascript - While Loop
- Javascript - For Loop
- Javascript - For...in
- Javascript - Loop Control
- Javascript - Functions
- Javascript - Events
- Javascript - Cookies
- Javascript - Page Redirect
- Javascript - Dialog Boxes
- Javascript - Void Keyword
- Javascript - Page Printing
- JavaScript Objects
- Javascript - Objects
- Javascript - Number
- Javascript - Boolean
- Javascript - Strings
- Javascript - Arrays
- Javascript - Date
- Javascript - Math
- Javascript - RegExp
- Javascript - HTML DOM
- JavaScript Advanced
- Javascript - Error Handling
- Javascript - Validations
- Javascript - Animation
- Javascript - Multimedia
- Javascript - Debugging
- Javascript - Image Map
- Javascript - Browsers
- JavaScript Useful Resources
- Javascript - Questions And Answers
- Javascript - Quick Guide
- Javascript - Functions
- Javascript - Resources
How to set the length of the item relative to the rest with JavaScript?
Use the flex property in JavaScript to set the length of the item relative to the rest. You can try to run the following code to implement flex property with JavaScript −
Example
<!DOCTYPE html> <html> <head> <style> #box { border: 1px solid #000000; width: 300px; height: 400px; display: flex; } </style> </head> <body> <div id = "box"> <div style = "background-color:orange;">DIV1</div> <div style = "background-color:blue;">DIV2</div> <div style = "background-color:yellow;">DIV3</div> </div> <button onclick = "display()">Set</button> <script> function display() { var a = document.getElementById("box"); var b = a.getElementsByTagName("DIV"); var j ; for (j = 0; j < b.length; j++) { b[j].style.flex = "1"; } } </script> </body> </html>
- Related Articles
- Set how the item will shrink relative to the rest with JavaScript?
- How to set the order of the flexible item, relative to the rest with JavaScript?
- Set how much the item will grow relative to the rest of JavaScript.
- Set how much a flex item will grow relative to the rest of the flex items with CSS
- How to set the initial length of a flexible item with JavaScript?
- Specify how much a flex item will shrink relative to the rest of the flex items with CSS
- How to set the position of the list-item marker with JavaScript?
- How to set the list-item marker type with JavaScript?
- Specify the order of a flexible item relative to the rest of the flex items inside the same container with CSS
- Set the initial length of a flex item with CSS
- How to set an image as the list-item marker with JavaScript?
- How to find the coordinates of the cursor relative to the screen with JavaScript?
- How to set the boldness of the font with JavaScript?
- How to set div position relative to another div in JavaScript?
- How to set the widths of the image border with JavaScript?

Advertisements