0

im new to coding, ive been learning code for about 2 weeks now and ive made decent progress.. Ive decide to build a mock up site to put to use what im learning and its going well, except i cant seem to place an image and text side by side with the text at the bottom.

Im new so im not entirely sure how to go about asking or explaining lol sorry..

My image is inside my paragraph...

p class="text" img class="image" src="#.jpg" /p (had to remove tags, it wasnt showing)

My text is floated Right in CSS and my image is floated Left..

Ive tried numerous things like vertical align and different methods but nothing seems to work, is there anyone that has any ideas? tips? thanks

Dredd
  • 1
  • 2

1 Answers1

0

Ok, move the p tag to the bottom so its not wrapping around the image.

<img src="">
<p class= "p">text here</p>

Then for your paragraph class change the margin top to about 25%. You could use pixels here instead. I would maybe use the height of the image in pixels so that the text will always be aligned to the bottom of the image where you want it.

Does this help?

louisebelcher
  • 99
  • 1
  • 2
  • 16
  • Thanks for your advice bexter. I tried this method just now but unfortunately the text still sits at the top opposite the image... i'm not sure why nothing seems to work – Dredd Feb 22 '18 at 01:55
  • can you share your html and css? – louisebelcher Feb 22 '18 at 02:04
  • when you say you want the text at the bottom, do you just want the text to wrap around the image? Try putting the image first, then the text in your HTML. Then assign the float left property to the image class. – louisebelcher Feb 22 '18 at 02:07
  • No, although i did accidentally do that to another paragraph and image and it looked quite nice lol heres the html and css.. https://jsfiddle.net/dj6bvrh3/5/ where the text is, i want it at the bottom – Dredd Feb 22 '18 at 02:27
  • Just change the margin-top to 25% or whatever the height of the image is in pixels (px). I edited my answer above to show this. – louisebelcher Feb 22 '18 at 02:54
  • I cant seem to figure it out,so i've decided to go with another layout I think will work instead lol thanks for your help Bexter and Temani for linking the original question – Dredd Feb 22 '18 at 18:26