Spacing between picture and writing

[wolventears]

So, when you go about putting you picture to float left, what code do I use to space out the writing from it so it isn't right next to it?

[jouzinka]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis eget tincidunt turpis. Fusce sollicitudin magna et nisl gravida vehicula. Aliquam non tristique sapien. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras arcu leo, viverra at adipiscing a, interdum et est. Fusce tincidunt ut enim non pellentesque. Praesent congue magna non aliquet gravida. Sed eu sollicitudin nisl. Curabitur molestie urna pulvinar imperdiet hendrerit. Fusce non sem enim. Vestibulum eu lorem libero. Proin ut elit malesuada ligula viverra blandit. Donec consequat nisl quam, in adipiscing lacus malesuada a. Maecenas id lorem ut leo pretium suscipit sed non odio. Ut hendrerit, felis eu iaculis luctus, eros velit lacinia mauris, quis sollicitudin diam ligula et libero. Phasellus tellus erat, pulvinar ac consequat sed, eleifend at lorem.

Curabitur et augue non turpis ullamcorper luctus. Vestibulum in nisi quis diam consectetur molestie. Duis in consectetur quam, at dapibus urna. Nulla nec egestas tortor. In eu massa velit. In hendrerit sapien est, in fringilla augue dignissim in. Donec pellentesque elit enim, id pharetra nulla mattis et.

Morbi dolor nisi, scelerisque eget tellus et, rutrum imperdiet sem. Sed nisi orci, blandit ut sagittis at, congue et quam. Maecenas congue ligula lacus, in dictum enim vestibulum nec. Etiam sodales velit dui, ac placerat orci vulputate in. Praesent imperdiet tempus lorem, ut consequat risus aliquam in. Nulla ac tincidunt purus. Nulla elementum dignissim nisi, eget faucibus erat pulvinar sit amet. Aenean libero nisi, rhoncus quis nisi et, volutpat rhoncus orci. Integer quis mattis leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam ac nibh eu turpis convallis vestibulum.

Integer varius, neque lobortis varius volutpat, neque dui vestibulum tortor, vitae pharetra erat sem non augue. Duis suscipit condimentum leo ac iaculis. Suspendisse luctus rhoncus neque, ac placerat justo dictum eget. Sed tincidunt id massa a dignissim. Curabitur at nisi ultricies, dignissim nulla ut, pellentesque nisi. Nulla aliquam eu lacus ac blandit. Etiam placerat, massa consectetur ultrices pulvinar, turpis nisl rutrum erat, sed rhoncus massa massa eu mi. Nullam sagittis porttitor ornare.

Code Select Expand

[float=left][img padding=10]https://elliquiy.com/forums/avs/avatar_25972_1339537468.gif[/img][/float]

The "padding" attribute is what gives you the space. Substitute the 10 (the value is in pixels) with any number you desire, I usually use 5.  ;)

[Inkidu]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis eget tincidunt turpis. Fusce sollicitudin magna et nisl gravida vehicula. Aliquam non tristique sapien. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras arcu leo, viverra at adipiscing a, interdum et est. Fusce tincidunt ut enim non pellentesque. Praesent congue magna non aliquet gravida. Sed eu sollicitudin nisl. Curabitur molestie urna pulvinar imperdiet hendrerit. Fusce non sem enim. Vestibulum eu lorem libero. Proin ut elit malesuada ligula viverra blandit. Donec consequat nisl quam, in adipiscing lacus malesuada a. Maecenas id lorem ut leo pretium suscipit sed non odio. Ut hendrerit, felis eu iaculis luctus, eros velit lacinia mauris, quis sollicitudin diam ligula et libero. Phasellus tellus erat, pulvinar ac consequat sed, eleifend at lorem.

Curabitur et augue non turpis ullamcorper luctus. Vestibulum in nisi quis diam consectetur molestie. Duis in consectetur quam, at dapibus urna. Nulla nec egestas tortor. In eu massa velit. In hendrerit sapien est, in fringilla augue dignissim in. Donec pellentesque elit enim, id pharetra nulla mattis et.

Morbi dolor nisi, scelerisque eget tellus et, rutrum imperdiet sem. Sed nisi orci, blandit ut sagittis at, congue et quam. Maecenas congue ligula lacus, in dictum enim vestibulum nec. Etiam sodales velit dui, ac placerat orci vulputate in. Praesent imperdiet tempus lorem, ut consequat risus aliquam in. Nulla ac tincidunt purus. Nulla elementum dignissim nisi, eget faucibus erat pulvinar sit amet. Aenean libero nisi, rhoncus quis nisi et, volutpat rhoncus orci. Integer quis mattis leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam ac nibh eu turpis convallis vestibulum.

Integer varius, neque lobortis varius volutpat, neque dui vestibulum tortor, vitae pharetra erat sem non augue. Duis suscipit condimentum leo ac iaculis. Suspendisse luctus rhoncus neque, ac placerat justo dictum eget. Sed tincidunt id massa a dignissim. Curabitur at nisi ultricies, dignissim nulla ut, pellentesque nisi. Nulla aliquam eu lacus ac blandit. Etiam placerat, massa consectetur ultrices pulvinar, turpis nisl rutrum erat, sed rhoncus massa massa eu mi. Nullam sagittis porttitor ornare.

Code Select Expand

[float=left][img padding=10]https://elliquiy.com/forums/avs/avatar_25972_1339537468.gif[/img][/float]

The "padding" attribute is what gives you the space. Substitute the 10 (the value is in pixels) with any number you desire, I usually use 5.  ;)

That's either Latin or gibberish. :)

[Oniya]

It's gibberish 'filler text' used to display fonts and formats when a large block is needed but actual content isn't.

[jouzinka]

It's a dummy text. It's used to illustrate the natural flow of a (Anglo-Saxon) language (for example a Slavic would have a different text flow). It's much better than pasting an actual text as that distracts from the design you are trying to present and it's better than posting a wall of "text text text text," because that doesn't follow the natural flow of a language.

lipsum.com has everything about the text, history origins and such, as well as generator.

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.

See the difference between the "Latin," "Czech" and just text text text.

It's a handy little tool, generally known as "Lorem Ipsum." :)

And of course, Oni beats me to it. :D

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin vel sapien id purus laoreet consectetur. Phasellus porttitor lorem a felis sagittis facilisis. Maecenas sollicitudin lorem id urna feugiat, non rhoncus orci feugiat. Etiam gravida sit amet arcu non dapibus. Nunc commodo, risus ac tristique rutrum, dui nibh dignissim nunc, non feugiat sem sem eu orci. Integer metus felis, rutrum sit amet justo nec, aliquet bibendum justo. Suspendisse condimentum ipsum quis magna dictum, in pulvinar massa consectetur. Ut sagittis tristique justo.

O roš těslur. Zlipe ktéš tiflu s zráň rýšun gí něz oglyz, zráčlím břelkuzodi a kto ficlouh nitě z chrák, řuhřipepa mirtiň lkop stůť ulke. Pušt hřoko ditryk k něc divrve čilí didic myt udibluc. Ni důk. Vreděprb tust tlůc bůdlaž ktoklí tij zlun važtýblu vryř a úvěflást. Plíb ťábravřo diš? Chroglu šliféšky. Ni nivřeď mokřo měš s mybe. Probla olastglout monplezkůtká tivrač pletit nir diš vavreh hra sluplé jab klošttabledrž, s plat dizlu šoudlo zkyž tilust dlýštbuč. K dřáhřomy k útkoujíž. Digrou pěmru foť těsk mebeděcru s dihřev z mlůzpo. Vuvrou za byvab mytřá těpěšuršly a škous hlohlk, dě vuš čelků a gad zkeší a kroď štykla čítůti. Ugo s vě. Dlebyv vutimrouchlá houřádě těc a boby dě blízlyň batě šohštetid utě, břovynicli prest s rege. Báslakřoupěsk hrych něbě? člod žrabyr pustdi žodipa, loch břípo nitě dřoc.

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

[Haibane]

It still enjoys being near the padding= tag though ;)

[Caeli]

The clear tags (tag list here) can also be helpful if you don't have enough text to fill up the width of the post before another image comes up that is also floated in the post.  Usually a roleplaying post is fine (for example, I usually floatleft or floatright a single image and there are a few paragraphs of text following), but for a roleplay request thread or Ons & Offs that might need a little more in the way of formatting, it can be extremely helpful.

You can see an example of usage in this post, for the Winds Unchained idea.  There isn't much text, but to prevent the following idea and image from overlapping messily, I use the clearboth tag to push all text/image/code following that down past the floated image.

[wolventears]

Thanks to all who gave an answer. You were all very helpful!   XD