vertical spacing
-
I have a Page called ‘Events’; and within it I’ve listed the libraries I’ll be giving talks at.
I’m far from happy with its layout, but I’m buggered if I can think of a better way to do it.
I’m not seeking DESIGN advice, but layout advice with regard to how it already looks, but better!
Is anyone prepared to give me a pointer or two, please, as to how I could create completely equal vertical spacing throughout? Two areas that infuriate me are (1) the fact that regardless of how much I play around with the [div style=”height:??px;”][/div], it has little effect until the par.s are suddenly miles apart; and (2) the fact that I have virtually no control over where, beside each little image, the text starts.
OTY, brainiacs …The blog I need help with is: (visible only to logged in users)
-
First replace each one of these:
<div style="height:80px;"></div>
with this:
<div style="clear:both;"></div>
(This stops the wrap-around effect of left- or right-aligned images.)Then add a paragraph break (blank line) above and below each image code.
After you make these changes I’ll continue with the rest of the solution.
-
Good grief! – I didn’t get advice of this help in my Inbox!
I apologise for the tardiness of my reply, Panos, and will instantly do as you advise.
Can you now suggest why I wasn’t notified by the system of this, please? – and thank-you very much!!
Oh, don’t bother: I see that I neglected to tick the little box.
Christ, what a halfwit. :-( -
-
OK, done ’em.
:-)
I await your next availability, ευαίσθητα ελληνική άνθρωπος.
Heh heh .. -
Next, you need to adjust the image margins. If you didn’t have the upgrade you’d have to do this in the page editor. Since you have the upgrade you can do it in the CSS editor (for all the images on that page at once):
.page-id-1333 .entry img { margin-bottom: 41px; }Change the 41 to adjust the space below each thumbnail.
If you want to nudge the texts up in relation to the thumbnails, add a top margin to the above code.
The first image/text pair might be different than the rest. If so, turn this:
BERKELOUW’S [... ...] location.
to:
<p style="padding-top:1.5em;">BERKELOUW’S [... ...] location.</p>By the way, in the MARRICKVILLE text you’re missing a paragraph break after “location” and a space before the red text.
-
Oh, thanks HEAPS! – working in that text box with all those items meant to be separate can be tricky; so I’m not surprised I missed one.
I’ll do this after dinner, and report back if I have problems.
All this is much apprreciated: as you will readily understand, I would’nt’ve had a snowball’s chance in hell of ever coming up with a way of doing it, myself. -
Done. Like a dinner. :-)
Now, THAT looks something like it should! Before, it was all over the shop and looking very unprofessional; now I don’t have to cringe about it any more.
Thanks very much, Panos! -
SORRY.
Having bought a theme, the spacing has now become uncontrollable, dammit.
Does the CSS act differently on different themes, then? -
If you mean you tried my suggestion on zBench, it cannot have any effect: on zBench there’s no “.entry”. Most CSS is theme specific, among other reasons because each theme calls things its own way. On zBench the selector needs to be:
.page-id-1333 .content img -
As to its now being zBench rather than Massive Press, that’s because I lost all Comments when installing the latter; and applied to the designers for help, but none was forthcoming until a short time ago.
But yes, that’s what I meant. The trouble is that I keep coming up with things that I find I can’t do, theme after theme, which is why I keep changing ’em (not this particular one, in this case).
ANYWAY, I shall act on this after brekkie, and am most grateful for your reliable input, Panos.
- The topic ‘vertical spacing’ is closed to new replies.