sos.sos...help me... help me... plz

[dariush29722]

hello my friends
i designed an container with div tag but it is not good displayed in corner left and right.please see my container and help me.

container for download and help:
container.zip

[Designer_101]

so whats the actual problem?
i dont understand?

[MidiMagic]

hello my friends
i designed an container with div tag but it is not good displayed in corner left and right.please see my container and help me.

container for download and help:[ATTACH]8618[/ATTACH]

I could help if it weren't a zip file.

[Designer_101]

midimagic have you any idea what he wants?
I dont understand lol

I've extracted the files and would be happy to attach them if you like, but i dont understand what the problem is.

[dariush29722]

midimagic have you any idea what he wants?
I dont understand lol

I've extracted the files and would be happy to attach them if you like, but i dont understand what the problem is.

hello my friemd
all corners is destroyed.
please help

[kanaku]

Ok I got the files, I'll try to work on them.

For the others who want to know what the problem is, this attachment shows the background of this middle divs overshooting... so the rounded corners effect is broken.

[kanaku]

Ok... I was trying to code it all up from scratch and make new slices of your images but... I give up (sorry) because I have no idea what the site is for. And I need that to answer the following stuff about the boxes:

1. are they going to extend downwards?
2. are they fluid-width (meaning one set of background images for different box-widths)?
3. can I or can't I remove the transparency of the rounded corners. If you have a changing background, other than white, you need the transparency... if it will stay white for the whole time you're going to use this layout, you can remove the transparency of the corners (which is where all the problem is coming from in the first place...)

If you have a plain white background for the page, I suggest you open your original image files and disable the transparency. That was the initial problem. So if you make the corners a solid color outside the rounded outline (except for the top-right-star background), you won't see the extended borders anymore and you can revert back to your original code.

Here's how I would do it if I can't remove the transparency:

<div class="tab-div-1000">
	<div class="tab-header">
	Text/HTML
	</div>
	
	<div class="tab-body">
	Tab content goes here
	</div>
	
	<div class="tab-footer">
	</div>
</div>

<div class="tab-div-250-left">
	<div class="tab-header">
	Text/HTML
	</div>
	
	<div class="tab-body">
	Tab content goes here
	</div>
	
	<div class="tab-footer">
	</div>
</div>

<div class="tab-div-mid">
	<div class="tab-header">
	Text/HTML
	</div>
	
	<div class="tab-body">
	Tab content goes here
	</div>
	
	<div class="tab-footer">
	</div>
</div>

<div class="tab-div-250-right">
	<div class="tab-header">
	Text/HTML
	</div>
	
	<div class="tab-body">
	Tab content goes here
	</div>
	
	<div class="tab-footer">
	</div>
</div>

and the CSS for that:

.tab-div-1000
{
display: block;
width: 1000px;
}
.tab-div-250-left
{
float: left;
display: block;
width: 1000px;
}
.tab-div-mid
{
float: left;
display: block;
width: 1000px;
}
.tab-div-250-right
{
float: left;
display: block;
width: 250px;
}
.tab-body
{
background: #DF0FF;
border-left: 1px solid #4a7296;
border-right: 1px solid #4a7296;
margin: 0; padding: 0;
}
.tab-body, .tab-header, .tab-footer
{
width: 100%;
}


.tab-div-1000 .tab-header
{
background: url(1000-px-wide-header-image.gif) no-repeat top left;
}
.tab-div-250-left .tab-header, .tab-div-250-right .tab-header
{
background: url(250-px-wide-header-image.gif) no-repeat top left;
}
.tab-div-middle .tab-header
{
background: url(something-px-wide-header-image.gif) no-repeat top left;
}

.tab-div-1000 .tab-footer
{
background: url(1000-px-wide-header-image.gif) no-repeat top left;
}
.tab-div-250-left .tab-footer, .tab-div-250-right .tab-footer
{
background: url(250-px-wide-footer-image.gif) no-repeat top left;
}
.tab-div-middle .tab-footer
{
background: url(something-px-wide-footer-image.gif) no-repeat top left;
}

... You will have to make a header and footer image for EACH size of box you plan to use... Tedious. And ugly.

When this thread is closed I will sneak back in and delete this post... LOL

[braindumps]

No one would easily download a zip.And Plain Text will be better.