...

View Full Version : How do I revert a CSS box?



|Norman|
02-14-2008, 01:02 PM
Hi, please take a look at this image:

http://img180.imageshack.us/img180/8136/sduk9.jpg

How do I revert it?

This is my HTML:


<!-- Message Box -->

<div class="m_topleft">
<div class="m_topright">
<div class="m_topmid">
</div>
</div>
</div>
<div class="m_left">
<div class="m_right">
<div class="m_mid">
<div class="m_content">
<!-- Begin content -->

My content....

<!-- End content -->
</div>
</div>
</div>
</div>
<div class="m_bottomleft">
<div class="m_bottomright">
<div class="m_bottommid">
</div>
</div>
</div>
<!-- / Message Box -->

..and this is my CSS:


/* Message Box */

.m_topleft {
background: url(skin/message/b_01.gif) top left no-repeat;
}
.m_topright {
background: url(skin/message/b_03.gif) top right no-repeat;
padding: 0px 20px 0px 28px;
/* The first and third should be 0px, the second is the width
of the top right corner image and the fourth is the width
of the top left corner image */
}
.m_topmid {
background: url(skin/message/b_02.gif) top right repeat-x;
height: 17px; /* This height must be the height of the background image used */
}
.m_left {
background: url(skin/message/b_04.gif) top left repeat-y;
}
.m_right {
background: url(skin/message/b_06.gif) top right repeat-y;
margin-right: 2px;
padding: 0px 18px 0px 0px;
/* The first and third should be 0px, the second is the width
of the right border image and the fourth is the width
of the left border image */
}
.m_mid {
background: url(skin/message/b_05.gif) top left no-repeat;
padding-left: 28px;
}
.m_content {
background-color: #FFFFFF;
}

.m_bottomleft {
background: url(skin/message/b_07.gif) top left no-repeat;
}
.m_bottomright {
background: url(skin/message/b_09.gif) top right no-repeat;
padding: 0px 20px 0px 28px;
/* The first and third should be 0px, the second is the width
of the bottom right corner image and the fourth is the width
of the bottom left corner image */
}
.m_bottommid {
background: url(skin/message/b_08.gif) top right repeat-x;
height: 17px; /* This height must be the height of the background image used */
}

/* Message Box End */

Can you help me, please?

VIPStephan
02-14-2008, 03:32 PM
You know, we can’t see at all what the image b_05.gif, or b_02.gif, or any of those images actually display. You need to show us a live example and/or give your images some more descriptive names (but I guess you didn't create that anyway and are just copying and pasting it).

What I can tell you is that you can’t mirror a graphic with CSS, you need to create a new one (i.e. mirror the image in a graphic editor) and apply it accordingly. If you apply an outline to the elements you see where they are and where to apply the image to.

|Norman|
02-14-2008, 04:09 PM
Thank you for your reply, VIPStephan.
Here my forum (message's box): http://www.web-city.it/forum/showthread.php?t=3087.
Ok, after creating a new *reverted* image (this (http://www.web-city.it/forum/skin/message/b_05.gif)), how do I revert that CSS code?

effpeetee
02-15-2008, 11:39 AM
i.e. mirror the image in a graphic editor

This FREE Faststone viewer will do all that you need.

http://www.faststone.org/

Frank

|Norman|
02-15-2008, 12:29 PM
I have Photoshop! :)
Anyway, thank you for you link, effpeetee.
How do I revert that CSS?

effpeetee
02-15-2008, 03:41 PM
Please explain what you mean by revert.

revert - go back to a previous state - according to the dictionary.


I too have Photoshop, but for quick re-sizing and inverting images, I find Faststone much quicker to use and totally satisfactory.

Frank

http://www.faststone.org/FSViewerDetail.htm



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum