Hi,
Please put the text of the div into p tag.
eg. <div class=’prose’> <p>and</p> </div>
In your css you say you want the paragraph in a div with the class ‘prose’ to have a certain style. This means you should either make sure your text is in a paragraph (which is the neatest way to do it, as text should generally be in a paragraph) or remove the paragraph factor from your css.
So you can fix this with css;
.prose {
text-indent:8em;
}
Or fix it with a bit of html;
<div class="prose"><p> text </p></div>
It looks like adding <p> </p> worked, after a fashion, but not the way I wanted it to. Until I added blank lines in the html code, only the first line was indented. With blank lines in the code, each paragraph is indented, but there is now a gap between paragraphs. Adding <br> betweem paragraphs either inserts a blank line, or if in the middle of a line of text, starts a new ‘paragraph’, that does not indent. Adding </p> at the end of each paragraph indents, but also adds a gap. Any ideas?
The post that I am attempting to work with is at:
http://garmanlord.com/wordpress/2015/06/08/the-psychology-of-religion-part-1-2/
there is now a gap between paragraphs
Manage this using margin and padding settings on your special paragraph style:
.prose p {
text-indent: 8em;
margin 4px 0 0 0;
padding: 0;
}
Use a browser inspector like firebug to show how your css is being used.
I still have a gap with:
.prose p {
text-indent: 3em;
margin 4px 0 0 0;
padding: 0;
}
in my stlye.css .
Thanks. I’ll have to wait until I get home to try firebug. Work machines are locked down.
I have no idea what I am looking at in firebug. The CSS for the page is:
img.wp-smiley, img.emoji {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
border: medium none !important;
box-shadow: none !important;
display: inline !important;
height: 1em !important;
margin: 0 0.07em !important;
padding: 0 !important;
vertical-align: -0.1em !important;
width: 1em !important;
}
the HTML is:
<html lang="en-US">
<head>
<body class="single single-post postid-43 single-format-standard logged-in admin-bar custom-background wordpost customize-support" data-pinterest-extension-installed="ff1.35">
</html>
I have no idea where to begin…
I think I was able to figure it out. I created another div class:
div.no-bottom-margin p { margin-bottom: 0px; }
and wrapped the main body of the text in:
<div class="no-bottom-margin"> main body </div>.
That seemed to do the trick. I think I am starting to understand div classes…
Thanks to everybody for the help!
