/    Sign up×
Community /Pin to ProfileBookmark

Justification?

Copy linkTweet thisAlerts:
Dec 11.2009

I’m trying to do something like the following within a table cell:

[URL=”http://www.amirams.com/Justify.png”]Example[/URL]

I managed to do it with a single-liner but not with a paragraph that spans several lines.

Can this be done? (Preferably without “position: relative” because IE has an issue with relative positions when resizing the browser window).

to post a comment
HTML

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@aj_nscDec 12.2009 — CSS on the table cell:

text-align: justify

EDIT: I am assuming you are talking about the justification of the text (assumed from the thread title and the image) and not the position of the more link.
Copy linkTweet thisAlerts:
@amiramsauthorDec 12.2009 — Actually I'm talking about both. What I need is to position the link on the same line as the last line of the text but justified to the right. As I said, I can manage this if I have a single line, but since the text is fully justified I cannot use <br> to separate the last line from the lines above it.
Copy linkTweet thisAlerts:
@FangDec 12.2009 — &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;title&gt;&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;

&lt;script type="text/javascript"&gt;
&lt;/script&gt;

&lt;style type="text/css"&gt;
* {margin:0;padding:0;}
p {width:300px; text-align:justify;}
p span {color:red; float:right;}
&lt;/style&gt;

&lt;/head&gt;
&lt;body&gt;
&lt;p&gt;Lorem ipsum dolor sit amet, consuetudium lectorum. aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipitlobortis nisl ut aliquip ex ea commodo consequat. &lt;span&gt;more...&lt;/span&gt;&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
Copy linkTweet thisAlerts:
@amiramsauthorDec 12.2009 — &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;title&gt;&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;

&lt;script type="text/javascript"&gt;
&lt;/script&gt;

&lt;style type="text/css"&gt;
* {margin:0;padding:0;}
p {width:300px; text-align:justify;}
p span {color:red; float:right;}
&lt;/style&gt;

&lt;/head&gt;
&lt;body&gt;
&lt;p&gt;Lorem ipsum dolor sit amet, consuetudium lectorum. aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipitlobortis nisl ut aliquip ex ea commodo consequat. &lt;span&gt;more...&lt;/span&gt;&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
[/QUOTE]

Thanks.

This seems to work when using the DOCTYPE that you specified. Unfortunately I'm using ASP.Net, not native HTML, and the DOCTYPE is as follows:

[CODE]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >[/CODE]

With this DOCTYPE, the "more" link is right-justified but it appears on a new line of its own, not on the last line of the text.

Any idea how to make it work with "my" DOCTYPE? I can do it using "position: relative" in the style, but IE does not refresh relative positions when the window size changes so I cannot use it.
Copy linkTweet thisAlerts:
@FangDec 12.2009 — I would suggest you change the DTD to a valid one; in the long run you will have fewer inconsistencies between browsers.
Copy linkTweet thisAlerts:
@amiramsauthorDec 12.2009 — I would suggest you change the DTD to a valid one; in the long run you will have fewer inconsistencies between browsers.[/QUOTE]

Unfortunately I cannot do this. The whole code generated by ASP.Net depends on the DTD. If I change it, everything will be messed up.

(This site is several years old and it is written in an older version of ASP.Net. It cannot be upgraded easily to a later version).
Copy linkTweet thisAlerts:
@FangDec 12.2009 — &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" &gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;title&gt;&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;

&lt;script type="text/javascript"&gt;
&lt;/script&gt;

&lt;style type="text/css"&gt;
* {margin:0;padding:0;}
p {width:300px; text-align:justify;}
p span {color:red; float:right;}
&lt;/style&gt;
&lt;!--[if IE]&gt;
&lt;style type="text/css" media="all"&gt;
p span {margin-top:-1em;}
&lt;/style&gt;
&lt;![endif]--&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;p&gt;Lorem ipsum dolor sit amet, consuetudium lectorum. aliquam erat volutpat. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Ut wisi enim ad minim veniam,
quis nostrud exerci tation ullamcorper suscipitlobortis nisl ut aliquip ex ea commodo consequat. &lt;span&gt;more...&lt;/span&gt;&lt;/p&gt;
&lt;/body&gt;
×

Success!

Help @amirams spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...