Recent Topics

1 Jul 18, 2005 06:28    

When i upload the image

the image always occupied the whole row

i added class="left"

but the text still under the image

how can i left the text wrapping the image?

thanks.

2 Jul 18, 2005 13:11

X-KAM-X wrote:

When i upload the image
the image always occupied the whole row
i added class="left"
but the text still under the image
how can i left the text wrapping the image?

Use the float style ([url=http://www.w3schools.com/css/pr_class_float.asp]CSS Float property[/url]):

<img style="float:right;" alt="This is my image" src="/media/my_image.jpg />

You can also define a style in your CSS file. Here is an example of what I use in my own:

.bPosts img.img-incrustee {
	margin:0 0 8px 8px;
	padding:0 0 0 0;
	float:right;
	clear:right;
	border:4px solid #ffffff;
	background-color:#d0d0d0;
	filter:	progid:DXImageTransform.Microsoft.shadow(direction=135,color=#808080,strength=4);
}
.bPosts a img.img-incrustee {
	margin:0 0 8px 8px;
	padding:0 0 0 0;
	float:right;
	clear:right;
	border:4px solid #a0a0ff;
	background-color:#d0d0d0;
	filter:	progid:DXImageTransform.Microsoft.shadow(direction=135,color=#808080,strength=4);
}
.bPosts a:visited img.img-incrustee {
	margin:0 0 8px 8px;
	padding:0 0 0 0;
	float:right;
	clear:right;
	border:4px solid #8080d0;
	background-color:#d0d0d0;
	filter:	progid:DXImageTransform.Microsoft.shadow(direction=135,color=#808080,strength=4);
}
.bPosts a:hover img.img-incrustee {
	margin:0 0 8px 8px;
	padding:0 0 0 0;
	float:right;
	clear:right;
	border:4px solid #ffd0d0;
	background-color:#d0d0d0;
	filter:	progid:DXImageTransform.Microsoft.shadow(direction=135,color=#808080,strength=4);
}


that I added to the original Custom-based skin. Here is an example of the usage of that style:

<img class="img-incrustee" alt="This is my image" src="/media/my_image.jpg />

Here are two posts illustrating the usage of that style: ,

3 Jul 25, 2005 00:50

I've just made an archive of [url=http://blog.lesperlesduchat.com/index.php]my site's[/url]. You can download it from there: [url=http://blog.lesperlesduchat.com/media/zip/lesperlesduchat_v0.1.zip]lesperlesduchat_v0.1.zip[/url].

However, please notice the skin is specific to [url=http://blog.lesperlesduchat.com/index.php]my site[/url]. It should help you however to see how the CSS file can be modified to change the default images position.

Finally, I don't encourage you to change the default images positionning, since smileys are images and moving them somewhere else than inside the text would become strange for the reader.

This is why I haven't defined two separate "img-incrustee" (for "nested" images into a paragraph) and "ime-separee" (for images to be displayed on a single centered paragraph; the paragraph has to be aligned additionnally) classes.

4 Jul 25, 2005 14:13

thanks~

i made it~

^.^


Form is loading...