Little Coding Help, please? - Resolved

[Jag]

I'm making a profile type thing and I can't figure out (or remember how to) put a picture on one side and the words right next to it.

Ex:

Image Here
Image Here
Image Here               Text over here.
Image Here


That might be a bad example, but I think someone might get it. >.<

[Caeli]

Code Select Expand

[float=left]Image[/float]Text here.[/float]

I think that's what you want? :-)

[Zeitgeist]

Code Select Expand

[table]
[tr]
[td][img]https://elliquiy.com/forums/avs/avatar_4190_1262359135.jpg[/img][/td]
[td]Like this?[/td]
[td][img]https://elliquiy.com/forums/avs/avatar_4190_1262359135.jpg[/img][/td]
[td]Or this?[/td]
[/tr]
[/table]

Like this?

Or this?

[Caeli]

Tables are, in my opinion, only needed for grids (like above), but if you only want two columns, and the rest of the text to continue as normal...

If you're talking about something like this, floating definitely makes it look nicer, since it'll force your text to wrap around the image (which will be floating on the left or the right, depending on which float tag you use).

[Jag]

Yup, Caeli. That's what I needed. Thank you both so much. ^^

[Caeli]

Remember to use the 'padding' property unless your image has some transparency around its edges! :-)

[Jag]

Padding?

You mean the [/] thing at the end and beginning?

O_o

* Michi No Sora only knows the very basics of any coding.

[Caeli]

Oh! I will explain. Pay attention to the inside of the IMG tag. The padding=# is the space around the edges of the image (like a buffer area), with # being the number of pixels.



Without Padding

Code Select Expand

[float=left][img]https://elliquiy.com/elluiki/images/c/ca/Caeli.png[/img][/float]Lorem ipsum dolor sit amet, consectetur adipiscing elit...

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In luctus auctor urna, quis mollis nisl commodo a. Nullam blandit vulputate diam, nec egestas arcu rhoncus vitae. Fusce eget urna neque. Cras quis libero ut libero egestas mattis. Duis ut consequat tellus. Nullam tristique consequat dolor, at mollis elit laoreet ac. Vestibulum urna ligula, aliquet eu gravida et, ullamcorper non neque. Praesent quam nisl, eleifend et semper commodo, molestie in eros. Sed interdum tortor eget nunc ultrices hendrerit. Praesent mollis orci libero. Fusce non dui quis nisl blandit sodales sed eu lacus. Sed elementum fringilla sem, nec fringilla lectus vehicula in. Ut adipiscing blandit nisi id condimentum. Fusce nulla elit, gravida ac laoreet vel, volutpat a mi. Nullam sagittis accumsan sem id cursus. Duis et lectus eget turpis iaculis sodales a at leo.

Pellentesque at leo elit. Aenean porta augue nec lorem hendrerit pellentesque. Duis nunc neque, egestas vel facilisis eget, consectetur in elit. Phasellus magna enim, tincidunt et varius ultrices, commodo non diam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tristique ornare urna non eleifend. Donec turpis metus, laoreet vel sagittis ac, tincidunt vel orci. Cras vehicula ornare luctus. Aliquam consequat, quam nec dignissim sagittis, ante metus ultricies nunc, ac feugiat eros neque a nisl. Aenean eget augue orci, non tincidunt metus.

Ut sed diam risus, nec tempus dui. Mauris egestas, leo nec feugiat auctor, tellus nibh elementum libero, sit amet laoreet leo nisi semper magna. Praesent feugiat mattis turpis sed consectetur. Morbi quam erat, egestas ac adipiscing nec, commodo in nisl. Aliquam cursus dapibus velit, vitae iaculis dui dignissim eu. Cras feugiat quam sit amet turpis porta ac faucibus sapien accumsan. Quisque at fermentum justo. Nam viverra justo vitae velit luctus sed commodo risus consequat. Aliquam vel metus elit, et feugiat nunc. Phasellus dignissim pulvinar enim, tincidunt laoreet metus tincidunt at. Nulla adipiscing bibendum leo, egestas sagittis dolor pulvinar sed. Nulla facilisi. Duis euismod arcu id odio tristique euismod. Curabitur porttitor faucibus arcu laoreet laoreet. Morbi varius luctus porttitor. Nullam varius pretium tellus, sed blandit risus iaculis ac.



With Padding

Code Select Expand

[float=left][img padding=5]https://elliquiy.com/elluiki/images/c/ca/Caeli.png[/img][/float]Lorem ipsum dolor sit amet, consectetur adipiscing elit...

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In luctus auctor urna, quis mollis nisl commodo a. Nullam blandit vulputate diam, nec egestas arcu rhoncus vitae. Fusce eget urna neque. Cras quis libero ut libero egestas mattis. Duis ut consequat tellus. Nullam tristique consequat dolor, at mollis elit laoreet ac. Vestibulum urna ligula, aliquet eu gravida et, ullamcorper non neque. Praesent quam nisl, eleifend et semper commodo, molestie in eros. Sed interdum tortor eget nunc ultrices hendrerit. Praesent mollis orci libero. Fusce non dui quis nisl blandit sodales sed eu lacus. Sed elementum fringilla sem, nec fringilla lectus vehicula in. Ut adipiscing blandit nisi id condimentum. Fusce nulla elit, gravida ac laoreet vel, volutpat a mi. Nullam sagittis accumsan sem id cursus. Duis et lectus eget turpis iaculis sodales a at leo.

Pellentesque at leo elit. Aenean porta augue nec lorem hendrerit pellentesque. Duis nunc neque, egestas vel facilisis eget, consectetur in elit. Phasellus magna enim, tincidunt et varius ultrices, commodo non diam. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tristique ornare urna non eleifend. Donec turpis metus, laoreet vel sagittis ac, tincidunt vel orci. Cras vehicula ornare luctus. Aliquam consequat, quam nec dignissim sagittis, ante metus ultricies nunc, ac feugiat eros neque a nisl. Aenean eget augue orci, non tincidunt metus.

Ut sed diam risus, nec tempus dui. Mauris egestas, leo nec feugiat auctor, tellus nibh elementum libero, sit amet laoreet leo nisi semper magna. Praesent feugiat mattis turpis sed consectetur. Morbi quam erat, egestas ac adipiscing nec, commodo in nisl. Aliquam cursus dapibus velit, vitae iaculis dui dignissim eu. Cras feugiat quam sit amet turpis porta ac faucibus sapien accumsan. Quisque at fermentum justo. Nam viverra justo vitae velit luctus sed commodo risus consequat. Aliquam vel metus elit, et feugiat nunc. Phasellus dignissim pulvinar enim, tincidunt laoreet metus tincidunt at. Nulla adipiscing bibendum leo, egestas sagittis dolor pulvinar sed. Nulla facilisi. Duis euismod arcu id odio tristique euismod. Curabitur porttitor faucibus arcu laoreet laoreet. Morbi varius luctus porttitor. Nullam varius pretium tellus, sed blandit risus iaculis ac.

[Jag]

Okay. I understand. ^^ Thankies, Caeli. ^^