lando

Try using padding instead...it worked when I tested it.

Do you have this up somewhere? I've ran into this a couple of times and there are a few fixes for it, it would help to see the code.

Is there a specific issue you are having? You didn't mention any issues...

I'm not seeing the issue in IE7, are you using IE6?

I'll assume you are talking about this site? If so, on #main you need to remove position: absolute; and give it margin: 0 auto; When I did this it messed up some other elements within the site. This is being caused because you have assigned several elements position: absolute;, you will need to remove those.

You could also use header() in PHP or something similar in other scripting languages.

You need to add margin: 0 auto; to the #container element.

You may not have properly closed a tag within the form. I'd check to verify that all tags are closed properly.

True. If they select save-as it will save the image, if they select save link then it will download the .wav file. The other two methods I mentioned would be more fail proof.

I provided two links in my post that will tell you exactly how to do it, depending on which method you feel more comfortable with.

The way you have it setup now you would have to have them right click and select 'save-as'. If you want to force them to download it instead you could use a scripting language to set a header like PHP or use htaccess.

Okay. To change the text color you will need to change the numbers (hexidecimal) after color: below. For example: #FFF or #FFFFFF is white, #000 or #00000 is black. Photoshop is a great tool for this, but there are hundreds of other tools on the internet to generate hexidecimal colors. tr.sub_nav td a, tr.sub_nav td a:visited { color: #FFF; font: bold 14px Verdana, Geneva, Arial, Helvetica, sans-serif; } tr.sub_nav td a:hover { color: #FF0000; background-color : #FFF; } tr.sub_nav td a:active { color: #237cc4; }

Okay, well your question was how to make the background transparent without making the text transparent. What I gave you does that...you still need to adjust the color codes.

tr.subnav td { background-color : #CCC; filter:alpha(opacity=1); /* IF IE because IE sucks, and everyone hates it! and I hate M$*/ -moz-opacity: .1; /* if older mozilla or not not CSS3 */ opacity: .1; /* if Newer browser */ }

Good point wildteen88, I didn't even notice that he had a div nested inside a tr...which you can't do either. This is what it needs to look like: <tr class="subnav"> <td><a href="index.php"><b>Home</a></td> <td><a href="index.php?page_id=2">CONTACT US</a></td> <td><a href="index.php?page_id=49">GUESTBOOK</a></td> <td><a href="index.php?page_id=3">LINK TO US</a></td> <td><a href="index.php?page_id=5">NEWS/UPDATES</a></td> </tr> tr.sub_nav td a, tr.sub_nav td a:visited { color: #FFF; font: bold 14px Verdana, Geneva, Arial, Helvetica, sans-serif; } tr.sub_nav td a:hover { color: #FF0000; background-color : #FFF; } tr.sub_nav td a:active { color: #237cc4; } I am not extremely familiar with opacity and such. You might want to check out Quirksmode to see what limitations there are and the proper syntax.

I'm not completely sure what you mean by In your first post you had a div inside of an anchor. Although you have removed it you I would still like to point out the mistake. A div is a block element and an anchor is an inline element. You can not have a block element inside of an inline element. This might help you out in the future Something else you might consider doing, to make your html cleaner, is remove the bold from each anchor. You already have font-weight: bold; in your style sheet, this does the same thing and is better to use.

Okay, I got it to work in IE6, but when it does it breaks in Firefox. To get it to work in both browsers you will need to use an IF IE6 statement in your header. What I describe below is what you need to put in your IF IE6 style sheet. I don't have IE7 on my desktop, thank you MS Validation check, so you will need to test this on your own in IE7. First: I changed the width:130px; to width: 100%; in .mhead and .mlink a Second: I changed the width:130px; of #nav to width:127px; Third: I adjust the margin-left: 130px; of #content and #condiv to margin-left: 127px; The last one is a bit more tricky, and makes me cringe at the whole thing... You need to be able to adjust menudiv.jpg's width based on which browser is viewing it. Firefox needs the 130px version, IE needs the 127px version. To pull this off you will need to make the img a background of a div, this will let you define the background image separately in each style sheet. Like I said, this is how I got it to work. I really think there is a larger overall issue that is causing this problem...but as of right now I don't see it or don't know it.

Okay... let me play with it some.

I downloaded your site onto my machine and played around with it locally. The only way I could fix the issue was when I removed the navigation to the left. You might consider restructuring that navigation, maybe use something other than a table.

Are you wanting to align the entire div#info to the right of the logo or just the content of div#info right? That is two different things... If you want to align the content of div#info use text-align:right; in your css. If you are wanting the entire div#info to align right of div#logo then you will need to use floats. XHTML <div id="logo"> <img src="http://www.runnerselite.com/images/LOGO.jpg" width="750" height="100" alt="RunnerElite logo"/> </div> <div id="runnerlogo"> <img src="http://www.runnerselite.com/images/runner.jpg" alt="Runner Logo"/> </div> <div id="info"> <?include("include/info.inc.php");?> </div> <div class="clear"></div> CSS div#logo { float: left; text-align:center; margin-top:0; } div#runnerlogo { float: left; margin-top:-9%; margin-left:3%; } div#info { float: left; margin-top:-9%; margin-right:10%; } div.clear { clear: left; } This is just ONE of many ways to do it. This method floats all three boxes left and then clears the floats with div.clear. Floats can be very tricky for a beginner so I HIGHLY suggest you do some reading on them and fully understand how they work.

min-width/max-width should be supported by Firefox and IE7. To get IE6, or before, support you will need to use expressions.

I'd suspect that the navigation box on the left is pushing into the #content div, try playing around with it. You have the margin-right set to auto, try making that 0px.

I'm not saying NEVER use them, just not in that situation. I personally would never do an entire layout in absolute. It is fine to use absolute to place elements within a layout, just not the layout itself.

Is there anyway to get a link to view it? I'd like to see how the other elements are laid out to see if they are interfering in any way.

Why do you have two posts for the same problem? I've noticed that you are posting quite a bit on here, mostly for layout issues. I would like to make a suggestion without trying to sound rude in any way... It might be best to get a book that will take you step by step through the design process. Forums are great for asking questions and getting quick responses but basically the phpFreaks community has been designing your site for you. I personally am a huge fan of the Sitepoint books. I would specifically recommend Build Your Own Web Site The Right Way Using HTML & CSS and from there you can move onto HTML Utopia: Designing Without Tables Using CSS The advantage in using a book is that they will take you through the design process and show you what to do, and not to do, and also tell you WHY you should do something a certain way. Having a book will head off many issues you have been posting about and make your life much easier in the long run.