User:Annew/Floats
Test
Text Alignment
This should be positioned to the right side of the page:
| Right |
Text and Pictures
Testing float breaking left:
I bit more text.... I bit more text.... I bit more text.... I bit more text.... I bit more text....
Testing float breaking right:
Flow around
Test of floating text. The text source is copied from: [1] so you can see how it should be rendered.
By default a thumbnail is floated to the right of the page, with the text flowing around it. However, the tall "Style and formatting" box on the right of this tutorial might collide with a right-floating picture, so our first example specifies "left", and just below it you can see what the resulting picture looks like:
[[Image:Wikipedesketch1.png|thumb|left|alt=A cartoon centipede reads books and types on a laptop.|The Wikipede edits ''[[Myriapoda]]''.]]
The above text gives the image file name "Wikipedesketch1.png", the image type "thumb" and alignment "left", the alt text "A cartoon centipede reads books and types on a laptop.", and the caption "The Wikipede edits Myriapoda." A Wikipedia reader can click on the thumbnail, or on the small double-rectangle icon File:Magnify-clip.png below it, to see the corresponding file page which will let the user see the image in its original size.
Using tables
| The above text gives the image file name "Wikipedesketch1.png", the image type "thumb", left-alignment being the default, and the alt text "A cartoon centipede reads books and types on a laptop.", and the caption "The Wikipede edits Myriapoda." A Wikipedia reader can click on the thumbnail, or on the small double-rectangle icon File:Magnify-clip.png below it, to see the corresponding file page which will let the user see the image in its original size.
As you see, the text flows down the right of the picture, without a problem. It is, however, contained within a cell. This inevitably means that you can't guess how wide the screen is at the viewer's end, and if you do add enough text to fall below the caption you will see that it "hangs" within the bounds of the cell. You may need to duplicate these paragraphs to see the result, if you use a wide screen. |
By the way - don't use <code> tags on UserBase (except for single-word commands). Instead use the input and output templates like this: {{Input|1=your input line or block of code}}
your input line or block of code
and
{{Output|1=the text that is out put to a terminal}}
the text that is out put to a terminal
The "1=" takes care of code that includes "=" and some other characters which would otherwise cause an attempt at interpretation, and for safety we use it as default. Pipe symbols can be marked with nowiki tags or you can use the template {{!}} Use 'nowiki' around anything else that seems to cause problems. So far pipes and braces are the only things I've noticed. Hope this helps. annew 17:51, 20 September 2010 (CEST)
The above text gives the image file name "Wikipedesketch1.png", the image type "thumb" and alignment "left", the alt text "A cartoon centipede reads books and types on a laptop.", and the caption "The Wikipede edits Myriapoda." A Wikipedia reader can click on the thumbnail, or on the small double-rectangle icon File:Magnify-clip.png below it, to see the corresponding file page which will let the user see the image in its original size.
Hopefully this demonstrates that the problem (which applied only to images using the "thumb" attribute) is now cured. I shall now simply copy and paste to enlarge this text so that we can see how the flow works. I shall now simply copy and paste to enlarge this text so that we can see how the flow works. I shall now simply copy and paste to enlarge this text so that we can see how the flow works. I shall now simply copy and paste to enlarge this text so that we can see how the flow works. I shall now simply copy and paste to enlarge this text so that we can see how the flow works.
Here we break the flow...
I shall now simply copy and paste to enlarge this text so that we can see how the flow works. I shall now simply copy and paste to enlarge this text so that we can see how the flow works. I shall now simply copy and paste to enlarge this text so that we can see how the flow works.
| this text should be right-aligned - so we need to write enough to go into another line, and see what happens |