text align does not work

F

Fro

Hi,

I have an html-strict-valid document. In css I declare a specific text-
align for class ".instructions" (the text alignment is "justify").
However, the text put into <div class=".instructions"> ... </div> is
not aligned in the desired way. On my Mozilla browser it is aligned to
the "right", on my Explorer browser it is aligned to "center".

Why it happens and how this problem can be solved?

Thank You!

The page is here:
http://www.showandbeshown.com
 
F

Fro

Remove the dot from <div class=".instructions">
Click to expand...
Sorry, I put this dot only in the newsgroup message (by mistake). On
the real page I do not have dots (and it still does not work).
 
D

dorayme

Fro said:
Sorry, I put this dot only in the newsgroup message (by mistake). On
the real page I do not have dots (and it still does not work).
Click to expand...


You do not exactly have any <div class="instructions"> with or without
dots. You have a lot of spans...

What exactly are you not liking the look of?
 
F

Fro

You do not exactly have any <div class="instructions"> with or without
dots. You have a lot of spans...
Click to expand...
Yes. Sorry.
What exactly are you not liking the look of?
Click to expand...
In one of my browser I see text which is aligned to the right. In
another one text is centered. But I want to have the "justified" text
(i.e. text which is aligned to the right and left simultaneously).
Actually, in my css part I force this type of alignment, but it does
not work. And I do not like that.
 
D

dorayme

Fro said:
Yes. Sorry.

In one of my browser I see text which is aligned to the right. In
another one text is centered. But I want to have the "justified" text
(i.e. text which is aligned to the right and left simultaneously).
Actually, in my css part I force this type of alignment, but it does
not work. And I do not like that.
Click to expand...

Your mark up is truly bad. If you are going to use tables, be simpler.
At least study this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Padding</title>
<style type="text/css">
table {width: 100%;}
td {border: 1px solid; padding: .5em;}
..services {text-align: justify; width: 20em;}
..links {text-align: right;}
</style>
</head>
<body>
<table><tr><td class="services">Here is text justified. Here is text
justified. Here is text justified. Here is text justified. Here is text
justified. Here is text justified. Here is text justified. Here is text
justified. Here is text justified. Here is text justified. Here is text
justified. Here is text justified. Here is text justified. </td><td
class="links">Here is text aligned to the right</td></tr></table>
</body>
</html>
 
F

freemont

Remove the dot from <div class=".instructions">
Click to expand...
I don't see the OP, must be a Googler.

Just put that content into <p>s where it belongs anyway, and assign the
class to the <p>.
 
R

Roy A.

Oh.  Well try adding a dot.
Click to expand...

Are you tired today? It seems to me that the original poster (OP)
don't know the difference between inline-level elements
and block-level elements (div is a block-level element, span is an
inline-level element ). And I can't blame it.

CSS:

"Block-level elements are those elements of the source document that
are formatted visually as blocks (e.g., paragraphs). Several values of
the 'display' property make an element block-level: 'block', 'list-
item', and 'run-in' (part of the time; see run-in boxes), and
'table'."

"Inline-level elements are those elements of the source document that
do not form new blocks of content; the content is distributed in lines
(e.g., emphasized pieces of text within a paragraph, inline images,
etc.). Several values of the 'display' property make an element
inline: 'inline', 'inline-table', 'compact' and 'run-in' (part of the
time; see compact and run-in boxes). Inline-level elements generate
inline boxes."

HTML Block-level and Inline-level:

"Certain HTML elements that may appear in BODY are said to be "block-
level" while others are "inline" (also known as "text level"). The
distinction is founded on several notions:"

HTML notions on Block-level and Inline-level:

"Content model
Generally, block-level elements may contain inline elements and other
block-level elements. Generally, inline elements may contain only
data and other inline elements. Inherent in this structural
distinction is the idea that block elements create "larger" structures
than inline elements.

Formatting
By default, block-level elements are formatted differently than
inline elements. Generally, block-level elements begin on new lines,
inline elements do not. For information about white space, line
breaks, and block formatting, please consult the section on text.

Directionality
For technical reasons involving the [UNICODE] bidirectional text
algorithm, block-level and inline elements differ in how they inherit
directionality information. For details, see the section on
inheritance of text direction."

It's okay, but where is it defined?

Block-level elements:
<http://www.w3.org/TR/xhtml1/dtds.html#dtdentry_xhtml1-
strict.dtd_Block>

Inline-level elements:
<http://www.w3.org/TR/xhtml1/dtds.html#dtdentry_xhtml1-
strict.dtd_Inline>

For similar definitions not designed to work in conjunction with XML-
based user agents:
<http://www.w3.org/TR/html401/sgml/dtd.html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Text does not display correctly to glow 2
Wrong Coding 3
How to position the *tooltip* comment on these buttons? 9
Grid text alignment 1
All CRUD operations work except POST. Why? 2
An unknown bug doesn't allow the quotes app to work. What's the issue? 3
Jquery not triggering / acting as expected. 0
Aligned to the left 3

Members online

No members online now.
Total: 24 (members: 0, guests: 24)
Robots: 124

Forum statistics

Threads
473,773
Messages
2,569,594
Members
45,114
Latest member
GlucoPremiumReview

Latest Threads

Top