Solved

indent all but the first line

Posted on 2000-02-22
3
849 Views
Last Modified: 2008-02-20
I have a span inside a DIV...
(using IE5) when the span wraps inside the DIV, i'd like to indent those lines that wrapped.  Not the first lines.. only all lines that have wrapped.
thanks so much...

jack
0
Comment
Question by:hjack
  • 2
3 Comments
 
LVL 7

Expert Comment

by:nettrom
ID: 2545458
I'm not exactly sure how this would be most correctly solved, but I have a possible solution.  the logic goes:

1: add the desired indentation as a left padding of the DIV (space between the DIV's border and the content)
2: pull the first line back the same amount as the padding.

ideally I'd like to use the pseudo-class 'first-line' to solve it, but it's not supported by IE5 (I'm not sure if it's any better either).  I used 'text-indent' instead.  according to the CSS2 spec it's perfectly legal.  worked OK in Netscape 4 and IE5, didn't work in IE4 and Opera.

example uses a 25px indentation:

<div style="padding-left:25px;">
<span style="text-indent:-25px;">
"Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis te feugifacilisi."
</span>
</div>

the indentation can be set using any legal CSS value (percentage, pixels, em, ex, points, etc), only remember to have the same amount in both places and the text-indent should be a negative value.  otherwise you'll probably not get the effect you want.
0
 
LVL 28

Accepted Solution

by:
sybe earned 200 total points
ID: 2549944
<html>

<head>
<style type="text/css">
li {list-style : none ; text-align: left; text-indent: -3%}
</style>
</head>
<body>

<li>jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg
<li>jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg fhjgfj hgfhj gfjhg fjhgfjhg fj lkhjljk lhjkg lhjghjkgkjh jkhgkj gkjhgk jhgkj gkjg ghjk jhg hjk jhg jkgkhjg jygkjgkyj jkgh gf hjkgfhjkg fjhgf jhgfhjg
</body>
0
 
LVL 7

Expert Comment

by:nettrom
ID: 2574218
hjack, you still with us?
0

Featured Post

Active Directory Webinar

We all know we need to protect and secure our privileges, but where to start? Join Experts Exchange and ManageEngine on Tuesday, April 11, 2017 10:00 AM PDT to learn how to track and secure privileged users in Active Directory.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to change the link of an image using md5 in php ? 3 47
how to debug htl and js pages 8 39
removing a class in javascript 4 50
html border input line 7 16
Things That Drive Us Nuts Have you noticed the use of the reCaptcha feature at EE and other web sites?  It wants you to read and retype something that looks like this.Insanity!  It's not EE's fault - that's just the way reCaptcha works.  But it is …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question