PDA

View Full Version : HELP!! IE giving me format problems



makt25
20 Oct 2009, 02:30 PM
I have a semi-transparent background to the content of my website. In Firefox, everything looks great, but when I open it up in IE, parts of the background are transparent, and other parts arent! Can someone tell me why this is happening?? My website is www.tracymak.com

Here is the CSS:

/*Rounded Background*/
.dialog {
width:90%;
margin:0px auto;
min-width:20em;
max-width:700px; /* I only cut the left background images out to 800px. You could do much larger, etc. */
}

.dialog .hd .c,
.dialog .ft .c {
font-size:1px; /* ensure minimum height */
height:11px;
}

.dialog .hd .c {height:11px}

.dialog .ft .c {
height:14px;
}

.dialog .hd {
background:transparent url(http://www.tracymak.com/images/tl.png) no-repeat 0px 0px;
margin-right:14px; /* space for right corner */
}

.dialog .hd .c {
background:transparent url(http://www.tracymak.com/images/tr.png) no-repeat right 0px;
margin-right:-14px; /* pull right corner back over "empty" space (from above margin) */
}

.dialog .bd {
background:transparent url(http://www.tracymak.com/images/ml.png) repeat-y 0px 0px;
margin-right:14px;
}

.dialog .bd .c {
background:transparent url(http://www.tracymak.com/images/mr.png) repeat-y right 0px;
margin-right:-14px;
padding: 0 15px 10px 15px;
line-height: 22px
}

.dialog .bd .c .s {
margin:0px 8px 0px 4px;
background:#000 url(http://www.tracymak.com/images/ms.jpg) repeat-x 0px 0px;
padding:1em;
}

.dialog .ft {
background:transparent url(http://www.tracymak.com/images/bl.png) no-repeat 0px 0px;
margin-right:14px;
}

.dialog .ft .c {
background:transparent url(http://www.tracymak.com/images/br.png) no-repeat right 0px;
margin-right:-14px;
}


/*Rounded Dialog Box Content Style*/

.dialog h2 {
/* header */
margin:0px;
padding:0px;
margin-top:-7px;
font-family: "Trebuchet MS", Arial, sans-serif; text-transform:uppercase; color:#00CC99; font-size:24px; text-align:center;
}

.dialog h3 {
/* header */
margin:0px;
padding:0px;
margin-top:-7px;
line-height:22px;
font-family: "Trebuchet MS", Arial, sans-serif; text-transform:uppercase; color:#00CC99; text-align:left
}

.dialog p {
margin:0px 0px 0px 0px;
padding:3px;
font:0.95em/1.5em arial,tahoma,"sans serif";
}

html>body .dialog pre {
font-size:1.1em;
}

/*End Rounded Dialog Box Content Style*/



And here is the HTML:

<div id="content">
<div class="dialog">

<div class="hd">

<div class="c"></div>
</div>

<div class="bd">
<div class="c">
<p class="dialog"><h2><img class="center" src="http://www.tracymak.com/images/heading2.png" alt="Where modern meeds elegance"/></h2><br/>
<img class="tracy" src="http://www.tracymak.com/images/tracy_small.png" alt="Tracy Mak Profile Picture"/> Welcome to <strong>Tracy Mak Designs</strong>.
I am a freelance web designer
that specializes in creating
custom website layouts for my
clients. My passion for both marketing and web design have worked to my clients' advantage. I pride myself in keeping up with the latest trends in web design, and understanding the needs of my client and their audience. <br/>

<br/>
The following are some of the web services I provide.
<ul>
<li>HTML Web Design Layouts</li>
<li>Flash Web Design Layouts</li>
<li>Flash movie and banners</li>
<li>Word Press Blogs</li>
<li>Template Customization</li>
</ul>

I am working on building my experience
and portfolio at the moment, so pricing is negotiable.

<br/>
<br/>
Hope to hear from you soon!
<br/>
<br/>
<img src="http://www.tracymak.com/images/signature.png" alt="Tracy Mak Signature"/>
</p> </div>
</div>

<div class="ft">
<div class="c"></div>

</div>

</div>
</div>


Thanks in advance!