One way or another it is possible. Do you have a URL to share so I can take a look and provide a solution?
Hi Justin,
Thanks for your response. This is a good example: http://orientalspiceandsomechocolate.com/retro-fashion-1900-1915/
I know a little about CSS but not much. I came up with the concept of this design, but someone else did the coding.
(My website is under construction by the way)
Try adjusting your css a bit:
p:first-of-type::first-letter {
font-family: Brannboll;
color: #d49500;
font-size: 25px;
}
I adjusted the css. It worked for the text paragraphs!
However some picture captions still get the decorative letter, while they shouldn’t. Examples: http://orientalspiceandsomechocolate.com/vintageetiquette and http://orientalspiceandsomechocolate.com/there-is-something-about-historical-paris.
Maybe this has to the with the white space css problem I have between images? When I press enter I see it in the visual editor, but not when in the preview or when the post goes live. Sometimes I get way too much white space, while I only want one line of whitespace. Manually adding   or
in the text editor also does not work, I get too much whitespace.
I was thinking…can I make a frame around the image where I can put the top and below caption of an image? So it won’t be seen as text or a paragraph?
Ok, the problem lies in that your picture captions above the pictures are still simple paragraphs. You have a couple of options:
1)Apply a class only to the paragraphs where you want the first-letter styling and change the css selector to target the class.
2)Change the upper captions from <p> to <span> (or a heading) and apply styling to center the text over the image.
There are a number of other options but these two are probably some of the easiest…
I would also advise against using tables as you have on these pages but that is beyond the scope of your question.
Hmm I discovered that some blogposts don’t get the first decorative letter, like the first two posts on page 2 and also some other pages: http://orientalspiceandsomechocolate.com/page/2/. Do you know why this happens?
About the options:
– I am looking for a solution where I won’t have to change a lot manually in the text editor for every post. For example option 2: If you choose this option, do you have to change this manually for every blogpost you write?
– Does one of these options also solves the white space issue I have between images (no white space or too much white space?
– Option 2: Does this mean that you see the caption within the image with e.g. a frame)
