images
editTake a look at my user page.
<div align="{{{align|left|- padding:1em;padding-top:0.5em;}}}"> IMAGE HERE </div> does half the trick. However, the image width must exceed the displayed width of your screen, in pixels (with the standard Monobook skin and Firefox at 1024x768, that's roughly 830 pixels for me) AND you must define the div style as hidden overflow, extending the former example to
<div align="{{{align|left|- padding:1em;padding-top:0.5em;" }}}" style="height:HEIGHT IN PIXELS YOU WANT TO SHOW;overflow:hidden">. To choose the exact part of the image being displayed, you have to create a second div layer within the above mentioned first:
<div style="position:relative;top:DISTANCE IN PIXELS FROM THE TOP OF THE IMAGE;left:DISTANCE IN PIXELS FROM THE LEFT OF THE IMAGE">. Don't forget to close both div layers with </div>.
The example from my user page is
<div align="{{{align|center|- padding:1em;padding-top:0.5em;}}}" style="height:100px;overflow:hidden"><div style="position:relative;top:-100px;left:-0px">[[Image:Pansy.jpg|1200px]]</div></div> results in:
If you want to display as much of the image as possible, you must change the resolution to the width (in pixels) of your displayed page, but slightly exceeding it rather than too narrow (some 830px in my case):
<div align="{{{align|left|- padding:1em;padding-top:0.5em;}}}" style="height:100px;overflow:hidden;top:-100px">[[Image:Pansy.jpg]]</div> results in:
Be warned, however, that pages with such code may not work with Internet Explorer.
Regards, —AldeBaer 08:49, 8 June 2007 (UTC)
- Which is why this shouldn't be used in articles, only on user pages. —AldeBaer 11:03, 8 June 2007 (UTC)
- You're welcome. Another tip: You can always create subpages of your user page, such as User:Brest/sandbox to play around with code. The examples I put here are really cluttering your talk page right now, so you may want to move them to such a subpage. Just an idea. Also, if you have any further questions, don't hesitate to ask. —AldeBaer 16:43, 8 June 2007 (UTC)