all corner is destroy!pla help

[dariush29722]

hello my friend
I designed an container but all conrers is destroyed.
pleaz help me to solve this problam.
this is my code:
the ascx file:

<div class="containermaster_blue" align="center" dir"rtl">
            
                                            
              <div class="TRM" style=" display: inline-table;" align= "center">
                                        <div class="TR" style="float:right;" dir="rtl">
                                        </div>
                                        <div  class="action1">
                                             <dnn:ACTIONS runat="server" ID="dnnACTIONS" />
                                        </div>
                                        <div >
                                             <dnn:ICON runat="server" ID="dnnICON" />
                                        </div>
                                        <div  class="caption1" dir="rtl">
                                             <dnn:TITLE runat="server" ID="dnnTITLE" />
                                        </div>
                                        <div class="TL" style="width: 10px; float:left; position:relative;">
                                        </div>     
                                         <div class="TLM" align="left" >
                                             <dnn:ACTIONBUTTON5 runat="server" ID="ACTIONBUTTON1" CommandName="ModuleHelp.Action"
                                                            DisplayIcon="True" DisplayLink="False" />
                                              <dnn:VISIBILITY runat="server" ID="VISIBILITY1" />

                                         </div>                                                                                   
                                             
                   
                                      
               </div>
       
               <div >
              
                            <table width="100%" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td class="ML" valign="top" style="width: 10px" align="left">
                                <img src="<%= SkinPath %>spacer.gif" width="10" height="1" alt="">
                            </td>
                            <td class="containerrow2_blue" id="ContentPane" runat="server"  align="center">
                            
                            </td>
                            
                            <td class="MR" valign="top" style="width: 19px" align="right">
                                <img src="<%= SkinPath %>spacer.gif" width="19" height="1" alt="">
                            </td>
                        </tr>
                    </table>
                            
                            
                        
             </div>
             <div class="BM"  align= "center">
             <div class="BL">
                    </div>
             <div class="BR">
                    </div>
             </div>

///////////////////////////////////
the css file:

.containermaster_blue 
{
    margin:0px; padding:0px; border:0px;
	width: 100%;
	background-color: transparent;
	border-right: #FFFFFF 1px solid; 
	border-top: #FFFFFF 0px solid; 
	border-left: #FFFFFF 1px solid; 
	border-bottom: #FFFFFF 0px solid; 
	
}
.TR
{
	background-image: url(CornerTRight.gif);
	background-repeat: no-repeat;
	height: 29px;
	width: 30px;
}
.action1
{background-repeat: no-repeat;
 width:10%;
 float: right;
  padding:6px 0px 0px 0px;
}
.caption1
{
  padding:6px 0 0 0; width:100px; float:right;    
}

.TL
{
	background-image: url(CornerTLeft.gif);
	background-repeat: no-repeat;
	height: 29px;
	width: 10px;	
}
.TLM
{
	background-image: url(CornerTLMiddle.gif);
	
	height: 29px;
	width: 110px;
	text-align : left;
	float:left;
	
}
.TRM
{
	background-image: url(CornerTRMiddle.gif);
	height: 29px;
	width: inherit;
}
.MR
{
	background-image: url(MiddleRight.gif);	
	height: 1px;
	width: 19px;
}
.ML
{
	background-image: url(MiddleLeft.gif);	
	height: 1px;
	width: 10px;	
}
.BR
{
	background-image: url(BottomRight.gif);
	background-repeat: no-repeat;	
	height: 30px;
	width: 30px;
	float:right;
	padding:0px;
	margin:0px;
	border:0;
}
.BL
{
	background-image: url(BottomLeft.gif);
	background-repeat: no-repeat;
	height: 10px;
	width: 10px;
	float:left;
	padding:0px;
	margin:0px;
	border:0;
	position:relative;
	display:inline-table;
		
}
.BM 
{	
	/*filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0, FinishOpacity=100, Style=3);*/
	/*filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#F6FCE6', endColorStr='#A0BB54', gradientType='1');*/
	background-image: url(BottomMiddle.gif);
	background-repeat:repeat-x;
	height : 10px;
	width: auto;
	
	
	     }

/////////////////////////////// and this is the pic of my container with errors:

or: http://www.daniweb.com/forums/attachment.php?attachmentid=8690&stc=1&d=1230533140
////////////////////////
thanks

[kanaku]

Eep. That's a load. Have you tried toggling the bottommiddle.gif on or off? It's the only thing with repeat-x that I could see in your code...

[dariush29722]

hello my friend
but i don't use the repeat-x in codes??
plz help

[kanaku]

Your last class, at the bottom of the css file:

.BM
{
/*filter:progidXImageTransform.Microsoft.Alpha(Opacity=0, FinishOpacity=100, Style=3);*/
/*filter:progidXImageTransform.Microsoft.Gradient(startColorStr='#F6FCE6', endColorStr='#A0BB54', gradientType='1');*/
background-image: url(BottomMiddle.gif);
background-repeat:repeat-x;
height : 10px;
width: auto;
}

I don't know what the .gif background files looked like, but I take it that the repeat-x for bottommiddle is the culprit. Try changing the repeat-x to no-repeat.

[dariush29722]

Your last class, at the bottom of the css file:

.BM
{
/*filter:progidXImageTransform.Microsoft.Alpha(Opacity=0, FinishOpacity=100, Style=3);*/
/*filter:progidXImageTransform.Microsoft.Gradient(startColorStr='#F6FCE6', endColorStr='#A0BB54', gradientType='1');*/
background-image: url(BottomMiddle.gif);
background-repeat:repeat-x;
height : 10px;
width: auto;
}

I don't know what the .gif background files looked like, but I take it that the repeat-x for bottommiddle is the culprit. Try changing the repeat-x to no-repeat.

my frien my bottommiddle.gif is:

i should use the reapet-x.plz help me

[kanaku]

By "corner is destroyed" did you mean that a line extends past your rounded corners?

I know that you need repeat-x but have you tried hiding the background, just to test the result? Can you post a screencap of the page if the bottommiddle.gif is hidden?

[dariush29722]

By "corner is destroyed" did you mean that a line extends past your rounded corners?

I know that you need repeat-x but have you tried hiding the background, just to test the result? Can you post a screencap of the page if the bottommiddle.gif is hidden?

yes, line extends past my rounded corners. this is a pic of my page:

see and plz help

[kanaku]

Isn't that the same screencap in your first post?
Do you have a screencap of what happens when you set

.BL
{
background-repeat: no-repeat;
}

Just to know if it's the bottommiddle.gif that's causing it.

Other solutions I could think of is to remove the transparency outside the rounded corners of your .gif backgrounds. But that would cause problems when you have a darker background... =0

First, please post a screencap of your page when bottommiddle.gif is set from repeat-x to no-repeat. You can just post an unlabeled screencap (one without the red markers or labels).

[dariush29722]

Isn't that the same screencap in your first post? Do you have a screencap of what happens when you set

.BL
{
background-repeat: no-repeat;
}

Just to know if it's the bottommiddle.gif that's causing it.

Other solutions I could think of is to remove the transparency outside the rounded corners of your .gif backgrounds. But that would cause problems when you have a darker background... =0

First, please post a screencap of your page when bottommiddle.gif is set from repeat-x to no-repeat. You can just post an unlabeled screencap (one without the red markers or labels).

this picture is without reapet(noreapet):

[kanaku]

Ok. So it's the bottommiddle.gif that's extending over the rounded corners.

You can do two things. One is to remove the bottommiddle.gif background and just add a border-bottom: 1px solid #575c72; line in the classes/IDs belonging to the elements or boxes I've highlighted in green in the attached file. (I can't figure out which classes belong to which box in your code, sorry)

The other solution is to change your .gif files. Add a solid color outside the rounded corners. (So the bottommiddle.gif won't show through) But this will make your design less 'portable' --- so try adding a border to your boxes first.

[dariush29722]

Ok. So it's the bottommiddle.gif that's extending over the rounded corners.

You can do two things. One is to remove the bottommiddle.gif background and just add a border-bottom: 1px solid #575c72; line in the classes/IDs belonging to the elements or boxes I've highlighted in green in the attached file. (I can't figure out which classes belong to which box in your code, sorry)

The other solution is to change your .gif files. Add a solid color outside the rounded corners. (So the bottommiddle.gif won't show through) But this will make your design less 'portable' --- so try adding a border to your boxes first.

hello my friend
my container withborder-bottom: 1px solid #575c72; is:

but not set?
plz help.

[kanaku]

Try adding padding-bottom: 6px; to the boxes with border-bottom. BUT that's a bit primitive. =(

Can you post the current html and css codes?

OR when you have the page open in your browser, view the source, copy all and post it here.

[dariush29722]

Try adding padding-bottom: 6px; to the boxes with border-bottom. BUT that's a bit primitive. =(

Can you post the current html and css codes?

OR when you have the page open in your browser, view the source, copy all and post it here.

hello my friend
this is pieces of container that is destroy, please see and help:
http://www.daniweb.com/forums/thread163558.html
thanks very much my friend.