Ok, so the best way to describe my issue is to go to the page: www.jcubedtech.com. Note: you MUST view this in Firefox (possibly only 3 or higher) or it will look terrible. So I have three "rounded rectangle" sections. They are all floated, or they don't look right. There is also a pic to the left of the top float, and above the left float. If I shrink the pic everything lines up correctly, but when I try to increase the size of the pic (to the maximum with the space available) the left float jumps to the right of the pic. The css pages that are related are as follows (all in the home directory): roundedyellow.css (The navbar) roundedtop.css (The top bar) actions.inc (a php include file with inline css in the code for the pic) Oh and the pic is floated left too. Any ideas? Also, if you know why it crashes in IE, please let me know. Thanks, Jeff
Ok... I fixed that issue. But now I have a new one. My site works fine in Firefox. It doesn't quite validate by W3C, but when I try to edit it so it works, it dies in IE. The main problem is, in IE my rounded rectangles don't have a bottom. I would try reordering the divs for the rect's images, but then it will die in firefox. This question would best be handled by a "rounded corners" expert, but I'm open to ideas. Once again the site is jcubedtech.com.
Well for the menu items i think it would be smarter to use a full bk image than using rounded corners: <div class="roundedtop"> <div class="tb"> <div class="tl"> <div class="tll"> <div class="tr"> <div class="tlr"> <div class="tt"> <div class="tul"> <div class="tur"> JCubed Technology </div> </div> </div> </div> </div> </div> </div> </div> </div> Code (markup): Looks a little extreme maybe you should look into the sliding doors technique. Your bottom disappears because the overflow is hiding. If you want rounded corners you might wanna look here that's how i do em.
Yeah, I'm not really willing to change the entire way I do the site. Plus, I just use a php page, so it's not like I'm typing all this stuff over, and over again. And I don't really understand how you do yours. Now I've fixed most of my problems, the one question I have is how does this site look in IE7 on your computer? On mine I "hacked" it so that the bottom link has the "overflow: hidden;" property because for some reason it was snapping the bottom of the last blue link to the bottom of the yellow bounding box. I tried messing with padding and the best I could ever get was the blue box the same, larger size, but with the yellow box dropping down lower. Right now I really need to know how it looks in IE7. Thanks, Jeff
I use ie6 in wine but in ie7 you should try browsershots.org or something like http://ipinfo.info/netrenderer/index.php I'm just saying you could cut down about 70% your size in html by changing the way you coded that using an <li> with a background image. Not like they need to stretch vertically.
Oh, ok you used <li>s. No, I do need to let it stretch vertically, that's why I did this way. You see our client audience is usually pretty technically challenged, so they may have changed the font size without knowing. Plus, a great deal of them are pretty old and increased the font size so they can see. This way our buttons contain the text even if the text size increased. I found out the reason why it crashed for some people was that I'm using javascript to cheat the browsers and some browsers have it turned off.