/    Sign up×
Community /Pin to ProfileBookmark

Want to indent word-wrapped text

I have some text that is indented using margin-left. When this text is longer than the div container, it wraps to the next line. I’d like the wrapped line to indent to the same starting position as the start of the text.

Example: current behavior: (note: I’ve substituted ‘.’ for spaces)
…….Positioning and
Layering

Desired behavior:
…….Positioning and
…….Layering

Thank you!

to post a comment
CSS

2 Comments(s)

Copy linkTweet thisAlerts:
@ShrineDesignsJan 03.2006 — CSSdiv span {
margin-left: 20px;
white-space: normal;
}
HTML<div><span>some text ...</span></div>
Copy linkTweet thisAlerts:
@JazzcatCBauthorJan 04.2006 — CSSdiv span {
margin-left: 20px;
white-space: normal;
}
HTML<div><span>some text ...</span></div>[/QUOTE]

Shrine,

The text I need to indent is a link (sorry I did not mention that earlier). I tried to integrate your fix with my code, but it didn't work. Here's what I did:

CSSa.sub-heading-2:link,a.sub-heading-2:active, a.sub-heading-2:visited {
font-size: 0.9em;
text-indent: 0em;
height: 1em;
padding: 0px;
margin-top: 3px;
margin-right: 3px;
margin-bottom: 3px;
margin-left: 18px;
white-space: normal;
color: #FF6;
}
HTML<div class="sidebar" align="left">
<h3 class="col-heading">Available Exams</h3>
<ul>
<li class="sub-heading-1"><a href="javascript:confirmExit('html-basic.php')">XHTML</a>
</li>
</ul>
<ul class="active-head-1">
<li class="sub-heading-1">CSS<br />
</li>
</ul>
<a class="sub-heading-2" href="javascript:confirmExit('test-css.php')">Basics</a>
<br />
<a class="sub-heading-2" href="javascript:confirmExit('css-fonts.php')">Fonts</a>
<br />
<span class="sub-head-active">
Formatting
</span>
&lt;br /&gt; <br/>
&lt;a class="sub-heading-2" href="javascript:confirmExit('css-color.php')"&gt;Color and Images&lt;/a&gt;
&lt;br /&gt;
&lt;a class="sub-heading-2" href="javascript:confirmExit('css-position.php')"&gt;Positioning and Layering&lt;/a&gt;
&lt;br /&gt;
×

Success!

Help @JazzcatCB 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 6.16,
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: @nearjob,
tipped: article
amount: 1000 SATS,

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

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...