CODEWITHSUNDEEP
htmlcss
Kees C. Bakker
Kees C. Bakker

Reputation: 33381

CSS: How to remove enter from HTML?

Consider the following Html:

<div class="one">
    <span>1. test</span>
    <span>test</span>
</div>
<div class="two">
    <span>2. test</span><span>test</span>
</div>

The result is:

1. test test
2. testtest

I need a piece of CSS that will remove the space (or enter) between the two words of the 1st line so it will look like the 2nd line. Is it possible to remove the space with CSS?

Clarification: I'm searching for a solution without having to adjust the html!

Upvotes: 1

Views: 4195

Answers (6)

Jeroen
Jeroen

Reputation: 801

basically you can't remove enters with css. You could do it by script or prevent them from appearing by adjusting the source.

Upvotes: 2

Amit
Amit

Reputation: 22076

If you want to remove White Spaces between the words it is not possible using CSS because White Space is a character. If you decrease spacing between the words it will condense whole text. Other option is to use JavaScript or Jquery.

Upvotes: 0

clairesuzy
clairesuzy

Reputation: 27624

.one {word-spacing: -4px;}
.one span {word-spacing: normal;}

If there are only spans in the div, remove (or neutralise) the word-spacing from the div then reset it to normal for the actual spans

See working example

Update:

As rightly pointed out by @Alohci in the comments on their answer the space between words is font-size dependant so it might be better to use -0.25em instead of -4px. this is a quarter of the default (4px being a quarter of 'default' 16px) note this is also font-family dependant, however it should be much more robust to use the ems

Upvotes: 5

Alohci
Alohci

Reputation: 82986

div.one span { float:left; }

http://jsfiddle.net/7CRYP/

Upvotes: 3

danjah
danjah

Reputation: 3059

Depends how dirty you feel - http://jsfiddle.net/sh2Pr/

Upvotes: 0

bfontaine
bfontaine

Reputation: 19835

No, but you can do that in your HTML code:

<div class="one">
    <span>1. test</span><!--
    --><span>test</span>
</div>

For example: http://jsfiddle.net/sh2Pr/

Upvotes: 0

Related Questions