Home arrow DHTML arrow Page 6 - Text-Justify, Volume, and Other Style Sheet Properties

Text-Justify, Volume, and Other Style Sheet Properties

In this conclusion to a ten-part series on style sheet properties, you'll learn about things you can do with text, how to set the width of an element, and more. This article is excerpted from chapter four of Dynamic HTML: The Definitive Reference, Third Edition, written by Danny Goodman (O'Reilly; ISBN: 0596527403). Copyright 2006 O'Reilly Media, Inc. All rights reserved. Used with permission from the publisher. Available from booksellers or direct from O'Reilly Media.

Author Info:
By: O'Reilly Media
Rating: 5 stars5 stars5 stars5 stars5 stars / 14
November 01, 2007
  1. · Text-Justify, Volume, and Other Style Sheet Properties
  2. · Text-transform
  3. · Vertical-align
  4. · Volume
  5. · Word-break
  6. · Writing-mode

print this article

Text-Justify, Volume, and Other Style Sheet Properties - Writing-mode
(Page 6 of 6 )


IE 5.5 NN n/a Moz all Saf all Op all CSS n/a

Inherited: Yes

Intended primarily for languages that display characters in vertical sentences, this controls the progression of content, left-to-right, or right-to-left.

CSS Syntax

writing-mode: direction


One of the constant values: lr-tb | tb-rl. Value of tb-rl can rotate text of some languages by 90 degrees.

Initial Value       lr-tb

Applies To                   All elements.

Object Model Reference


IE 4 NN 4 Moz all Saf all Op all CSS 2

Inherited: No

For a positioned element, this sets the stacking order relative to other elements within the same parent container. See Online Section V for details on relationships of element layering amid multiple containers.

CSS Syntax

z-index: integer | auto


Any integer value. A value of auto is the same as a value of zero. When all elements in the same parent container have the same z-index value, the stacking order is determined by element source code order.

Initial Value           auto

Example         div#instrux {position: absolute; left: 50; top: 70; z-index: 2}

Applies To               Positioned elements.

Object Model Reference



Rendering mechanisms in many browsers and versions generate form controls (buttons, text boxes, and especially select elements) in such a way that they always render in front of a positioned element, regardless of z-index property setting. This means that a positioned element may find a form control from the regular content flow sticking out in front of the positioned element, such as a drop-down menu. There is no workaround for this, other than to set the visibility of the form controls (or its form container) to hidden while the positioned element is visible. IE 7 fixes this problem.

IE 5.5 NN n/a Moz n/a Saf n/a Op n/a CSS n/a

Inherited: No

Controls the magnification of rendered content. This is particularly useful for output that might be displayed on monitors with very high pixel density. See screen.logicalXDPI property in Chapter 2.

CSS Syntax

zoom: scale | percentage | normal


Magnification can be denoted as a floating-point number, a scaling factor (1.0 is normal), or a percentage (100% is normal).

Initial Value           normal

Example         body {zoom: 200%}

Applies To               All elements.

Object Model Reference


DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

blog comments powered by Disqus

- Text-Justify, Volume, and Other Style Sheet ...
- Ruby-Position, Size, and Other Style Sheet P...
- Padding, Pages, and More Style Sheet Propert...
- Marks, Orphans, and More Style Sheet Propert...
- Layouts, Margins, and Other Style Sheet Prop...
- Floats, Fonts, and Other Style Sheet Propert...
- Color, Filters, and Other Style Sheet Proper...
- Borders and More with Style Sheets
- Learning Style Sheet Properties
- Style Sheet Property Reference
- Completing a Noisy Image Application
- An Object-Based Approach to Building Noisy I...
- A Basic Method for Building Noisy Images
- Adding More Features to Sliders with the Scr...
- Using Sliders with the Scriptaculous Framewo...

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials