CSS User Interface
CSS provides more user interfaces features like resizing elements, outlines, and box-sizing(box – border).
List of CSS3 user interface:
- appearance: Elements as user interface elements.
- box-sizing: Fix elements on an area in a clear way.
- icon: Provide the icon on the area.
- resize: Resize elements that are on the area.
- outline-offset: Space between an outline and the edge or border of an element.
- nav-down: Move down while pressing the down arrow button on the keypad.
- nav-left: Move left while pressing the left arrow button on the keypad.
- nav-right: Move right while pressing the right arrow button on the keypad.
- nav-up: Move up while pressing the up arrow button on the keypad.
CSS3 Resize property:
Horizontal Resize:
<!DOCTYPE html>
<html>
<head>
<style>
div {
border: 2px solid red;
padding: 20px;
width: 300px;
resize: horizontal;
overflow: auto;
}
</style>
</head>
<body>
<div>This example specifies how to resize the width of a div element.</div>
</body>
</html>
OUTPUT:
