How can I prevent the text of a bio from overlapping an image?

+6 votes
173 views

Over half-way thru the bio of my father, I have a photo (of the ​U.S.S. Orizabu) and 1/2" or so of text appears on top of the image.  I've tried reducing the size of the image and that doesn't stop it. Right now I have the width set at 320px.  The original size of the image was 576x270.  

 

WikiTree profile: Minter Prickett
in WikiTree Tech by Living Prickett G2G6 Mach 9 (96.8k points)
retagged by Keith Hathaway

2 Answers

+7 votes
 
Best answer
Hi Patricia,

What you are referring to is not part of the text.  If you look at the edit page, you will see:

<div style="float:center; border:0px #ccc solid; color:red; font-size:11px;  background-color: #fff; width:200px; text-align: left; height:auto; margin: auto; padding:3px;">Minter at age five[[Image:Prickett-119-6.jpg|200px]]</div>

This specifically identifies the space where the picture will appear and you included, in red, a caption at the top of the picture.

By the way, that code is not supposed to be used any more.  If you use the template for an image, you can still control the placement (although not to the extent that (what people here call) "inline css" can.  Here is how to use the image template:

{{Image
|file =          (filename)
|align =       (c, r, or l - will be center if not specified)
|size =         (s, m, l, or # of pixels)
|label =       (alt text - if included, will be displayed when mouse is over picture)
|caption =  (under image - if included)
|wrap =      (y or n - if y then text appears to the left or right of picture)
}}

The attributes:  align, size, label, caption, and wrap are all optional - you can leave them out if you want.  If you use wrap = y then you need to use another template at the end of the text that you want to be next to the picture - that is:  {{Clear}}

If you would like me to make the change on 1 of your pictures so that you can see how I did it and use it as an example to do the rest of them, just let me know.
by Gaile Connolly G2G Astronaut (1.2m points)
selected by Jillaine Smith
Yes, this system is much better  The other made no sense to me.  I just copied it and changed a few things and hoped for the best.  I'll go in and make changes on the other images when I have a few minutes.  Thanks for your help!
+4 votes
Make sure the width of the div is the same or bigger than the width of the picture. Right now the div is 310 and the picture is 330.
by Jamie Nelson G2G6 Pilot (631k points)

Related questions

+7 votes
1 answer
+12 votes
2 answers
288 views asked Mar 8, 2015 in WikiTree Tech by Living Prickett G2G6 Mach 9 (96.8k points)
+6 votes
1 answer
+10 votes
2 answers
237 views asked Oct 27, 2014 in WikiTree Tech by Living Prickett G2G6 Mach 9 (96.8k points)
+5 votes
3 answers
219 views asked Jan 15, 2017 in Policy and Style by Douglas Beezley G2G6 Mach 3 (36.2k points)
+5 votes
1 answer
228 views asked Apr 21, 2015 in Policy and Style by Living Prickett G2G6 Mach 9 (96.8k points)
+3 votes
3 answers
176 views asked Aug 26, 2019 in Genealogy Help by Living Prickett G2G6 Mach 9 (96.8k points)

WikiTree  ~  About  ~  Help Help  ~  Search Person Search  ~  Surname:

disclaimer - terms - copyright

...