Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Why does'nt text-align:justify work? Help

Status
Not open for further replies.
csphard

csphard

Programmer
Apr 5, 2002
194
US
Not sure why text-align: justify does not work?

<html><head><meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>test</title>
<style>
ul,li,h1,h2,h3,h4,h5,span,body {margin:0;padding:0;}
body {font-family:tahoma;text-align:center;}
#container {width:600px;margin:0 auto;border:10px solid black;padding: 5px;text-align:left;}
#header h1 {text-align:left;}
#content {text-align:center;}
#content2 {text-align:justify;}
#footer h1 {text-align:right;}
</style>
</head>
<body>
<div id="container">
<div id="header"><h1>testing align left</h1></div>
<div id="content"><h1>testing align center</h1></div>
<div id="content2"><h1>testing align justify</h1></div>
<div id="footer"><h1>testing align right</h1></div>
</div></body></html>
 
Sort by date Sort by votes
Justifying modifies the spaces between words so that all lines in a text are of equal length, cover all the available space, and have even margins. 3 words in a div will not show the effect of justification at all.

Not sure what you were expecting to see there.

Put in several lines of text and you'll probably see the effect.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Upvote 0 Downvote
It would indeed help to tell you what you need to change, if you'd also tell us, what you expect to see or happen.

If you rather want centering than block formatting text, you rather will want to use css style margin:auto. Besides browsers still understand <center>...</center> and while that won't validate for most doc types, it will work.

Bye, Olaf.
 
Upvote 0 Downvote
Depnding on which browser you use, you find developer tools, eg CSS inspector telling you what CSS is actively used at a selection of html.

My guess: Your <div id="content2"> has no width defined, therefor the h inside is just taking the place it takes to write the heading and so you won't see expanded space between the three words, even though you have set margin:auto on the outer div id container.

Bye, Olaf.
 
Upvote 0 Downvote
text-align:justify is working, just not the way that you expect it to.

When you tell the browser to display a block of text justified, it pads out complete lines with extra whitespace to fill the complete width of the block. If the last (or only) line isn't long enough to fill a line, it is displayed at normal spacing.

This is the right way to do it. Consider a paragraph of text set to justified alignment. The last line might only have two words in it - it'd look really weird to display them at opposite ends of the block:

[tt]
This is an example of some text
that has been displayed in a
justified style. If you apply
the justified approach to the
last line of the text it looks
really odd!
[/tt]

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd
 
Upvote 0 Downvote
Chris,

I share the pain, the new tek-tips editor is still having a couple of issues. But your point still comes over. I should also have thought about that, you can't of course justify a single line, even if a total width is defined.

Bye, Olaf.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lmcate
  • Locked
  • Question
From HTML Page open an MDB files on the server and work
Replies
0
Views
170
lmcate
lmcate
waubain
  • Locked
  • Question
Prevent user from getting a 404 error if click on a hover text displaying a hidden image. 1
Replies
5
Views
214
jjgupta915
jjgupta915
coldbohemia
  • Locked
  • Question
I'm inserting a text file into a we
Replies
2
Views
150
coldbohemia
coldbohemia
pendle666
  • Locked
  • Question
Inserting same line of text of every web page - &quot;link&quot; insert? 1
Replies
6
Views
192
ChrisHirst
ChrisHirst
csphard
  • Locked
  • Question
why does'nt my text-align:justify work?
Replies
5
Views
355
csphard
csphard

Part and Inventory Search

Sponsor

Back
Top