Remove White (Enter) Spaces from Post Text (CSS)
I'm trying to format my website post using CSS to look like a fiction book. At the moment I'm using a paragraph class (p.custom-indent7 { text-indent:60px;} ) to create first-line indents on each paragraph, but the problem is that there is still the white "enter space" caused by each enter, making the text hard to read.
Screenshot of the text formatting so far, with white spaces emphasized and slightly explained.
I'd love to find a way to remove this space using CSS, too. I'm using WordPress and don't know enough about CMS systems to edit the actual structure of the program, so something front-end would be preferable :)
Also, because I format books for EPUB anyway using HTML I don't mind manually applying the text formatting to each paragraph. It would be nice if there's an easier over-all method, but doing it once for the site is then also useful for the final .epub and .mobi versions of the books.
css post formatting
add a comment |
I'm trying to format my website post using CSS to look like a fiction book. At the moment I'm using a paragraph class (p.custom-indent7 { text-indent:60px;} ) to create first-line indents on each paragraph, but the problem is that there is still the white "enter space" caused by each enter, making the text hard to read.
Screenshot of the text formatting so far, with white spaces emphasized and slightly explained.
I'd love to find a way to remove this space using CSS, too. I'm using WordPress and don't know enough about CMS systems to edit the actual structure of the program, so something front-end would be preferable :)
Also, because I format books for EPUB anyway using HTML I don't mind manually applying the text formatting to each paragraph. It would be nice if there's an easier over-all method, but doing it once for the site is then also useful for the final .epub and .mobi versions of the books.
css post formatting
Welcome to SO. Since you're new, you might want to check how to create a minimal, complete, and verifiable example. The image you posted indicates that the paragraph-tag (still) has a margin, which causes the spaces at the top and bottom. But to be sure, we need some code to check.
– Michael
Nov 20 '18 at 7:13
You probably just want to eliminate the margins of the paragraph elements …
– misorude
Nov 20 '18 at 9:06
add a comment |
I'm trying to format my website post using CSS to look like a fiction book. At the moment I'm using a paragraph class (p.custom-indent7 { text-indent:60px;} ) to create first-line indents on each paragraph, but the problem is that there is still the white "enter space" caused by each enter, making the text hard to read.
Screenshot of the text formatting so far, with white spaces emphasized and slightly explained.
I'd love to find a way to remove this space using CSS, too. I'm using WordPress and don't know enough about CMS systems to edit the actual structure of the program, so something front-end would be preferable :)
Also, because I format books for EPUB anyway using HTML I don't mind manually applying the text formatting to each paragraph. It would be nice if there's an easier over-all method, but doing it once for the site is then also useful for the final .epub and .mobi versions of the books.
css post formatting
I'm trying to format my website post using CSS to look like a fiction book. At the moment I'm using a paragraph class (p.custom-indent7 { text-indent:60px;} ) to create first-line indents on each paragraph, but the problem is that there is still the white "enter space" caused by each enter, making the text hard to read.
Screenshot of the text formatting so far, with white spaces emphasized and slightly explained.
I'd love to find a way to remove this space using CSS, too. I'm using WordPress and don't know enough about CMS systems to edit the actual structure of the program, so something front-end would be preferable :)
Also, because I format books for EPUB anyway using HTML I don't mind manually applying the text formatting to each paragraph. It would be nice if there's an easier over-all method, but doing it once for the site is then also useful for the final .epub and .mobi versions of the books.
css post formatting
css post formatting
edited Nov 20 '18 at 9:28
gosi123
5091516
5091516
asked Nov 20 '18 at 5:27
The Dreaming SentinelThe Dreaming Sentinel
11
11
Welcome to SO. Since you're new, you might want to check how to create a minimal, complete, and verifiable example. The image you posted indicates that the paragraph-tag (still) has a margin, which causes the spaces at the top and bottom. But to be sure, we need some code to check.
– Michael
Nov 20 '18 at 7:13
You probably just want to eliminate the margins of the paragraph elements …
– misorude
Nov 20 '18 at 9:06
add a comment |
Welcome to SO. Since you're new, you might want to check how to create a minimal, complete, and verifiable example. The image you posted indicates that the paragraph-tag (still) has a margin, which causes the spaces at the top and bottom. But to be sure, we need some code to check.
– Michael
Nov 20 '18 at 7:13
You probably just want to eliminate the margins of the paragraph elements …
– misorude
Nov 20 '18 at 9:06
Welcome to SO. Since you're new, you might want to check how to create a minimal, complete, and verifiable example. The image you posted indicates that the paragraph-tag (still) has a margin, which causes the spaces at the top and bottom. But to be sure, we need some code to check.
– Michael
Nov 20 '18 at 7:13
Welcome to SO. Since you're new, you might want to check how to create a minimal, complete, and verifiable example. The image you posted indicates that the paragraph-tag (still) has a margin, which causes the spaces at the top and bottom. But to be sure, we need some code to check.
– Michael
Nov 20 '18 at 7:13
You probably just want to eliminate the margins of the paragraph elements …
– misorude
Nov 20 '18 at 9:06
You probably just want to eliminate the margins of the paragraph elements …
– misorude
Nov 20 '18 at 9:06
add a comment |
1 Answer
1
active
oldest
votes
Thanks Michael and Misorude! I didn't even know what I'm looking for, but your questions helped me find the research I needed. I changed my CSS class formatting to:
p.custom-indent7 {
text-indent:60px;
margin: 0px;
padding: 0px;
}
And it now formats the WordPress post like a fiction book, which is exactly what I wanted. Sorry that I didn't know more about coding, I really appreciate both your help :)
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53386739%2fremove-white-enter-spaces-from-post-text-css%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks Michael and Misorude! I didn't even know what I'm looking for, but your questions helped me find the research I needed. I changed my CSS class formatting to:
p.custom-indent7 {
text-indent:60px;
margin: 0px;
padding: 0px;
}
And it now formats the WordPress post like a fiction book, which is exactly what I wanted. Sorry that I didn't know more about coding, I really appreciate both your help :)
add a comment |
Thanks Michael and Misorude! I didn't even know what I'm looking for, but your questions helped me find the research I needed. I changed my CSS class formatting to:
p.custom-indent7 {
text-indent:60px;
margin: 0px;
padding: 0px;
}
And it now formats the WordPress post like a fiction book, which is exactly what I wanted. Sorry that I didn't know more about coding, I really appreciate both your help :)
add a comment |
Thanks Michael and Misorude! I didn't even know what I'm looking for, but your questions helped me find the research I needed. I changed my CSS class formatting to:
p.custom-indent7 {
text-indent:60px;
margin: 0px;
padding: 0px;
}
And it now formats the WordPress post like a fiction book, which is exactly what I wanted. Sorry that I didn't know more about coding, I really appreciate both your help :)
Thanks Michael and Misorude! I didn't even know what I'm looking for, but your questions helped me find the research I needed. I changed my CSS class formatting to:
p.custom-indent7 {
text-indent:60px;
margin: 0px;
padding: 0px;
}
And it now formats the WordPress post like a fiction book, which is exactly what I wanted. Sorry that I didn't know more about coding, I really appreciate both your help :)
answered Nov 21 '18 at 5:11
The Dreaming SentinelThe Dreaming Sentinel
11
11
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53386739%2fremove-white-enter-spaces-from-post-text-css%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Welcome to SO. Since you're new, you might want to check how to create a minimal, complete, and verifiable example. The image you posted indicates that the paragraph-tag (still) has a margin, which causes the spaces at the top and bottom. But to be sure, we need some code to check.
– Michael
Nov 20 '18 at 7:13
You probably just want to eliminate the margins of the paragraph elements …
– misorude
Nov 20 '18 at 9:06