Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Feb 2007
    Location
    Arizona
    Posts
    13
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Background Field wont fill useing IE

    I think I almost have this taken care of in Firefox but viewing it in IE theres still aways to go... What I'd like to get help with is CSS adjustments for my Skins/rsi/StyleSheets/popup.css ,, If you click Here then click "More Images" (right under the product image) in Firefox its how I want it,, but in IE the background color dosent expand in the field

    Where in my CSS am I off? or what do I need to add to the CSS to help IE out?

    What I'm trying to accomplish is for customers to be able to view a Full Sized Image that I'd rather FTP to the Images folder instead of useing the carts upload feature, (which seems to resize my images), If anyone views the other products, those images were uploaded via the carts upload feature, (hence "resized")
    #pageSurround is were the color is for the background

    Code:
    body {
    	margin: 5px;
    	background-color: #A5A5A5;
    	background-attachment: scroll;
    	background-image: url(../styleImages/backgrounds/pageBg.jpg);
    	background-repeat: repeat-x;
    	background-position: top;
    }
    #pageSurround {
    	background-color: #F2dec6;
    	border: 2px solid #000000;
    	margin-bottom: 5px;
    }
    #divThumbsImg {
    	overflow:auto; 
    	height: 700px; 
    	width: 120px; 
    	text-align: center; 
    	float: left; 
    	margin-right: 5px;
    	border-right: 2px solid #a44904;
    }
    .thumbsImg {
    	border: 1px solid #000000;
    	background-color: #000000;
    }
    #divMainImg {
    	float: left; 
    	width: 600px; 
    	height: 600px;
    	text-align: center;
    	overflow: hidden;
    	margin-bottom: 5px;
    }
    a.popupLink {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 75%;	
    	text-decoration: none;
    	color: #000000;
    	font-weight: bold;
    }
    a.popupLink:hover {
    	color: #070F72;
    	font-weight: bold;
    }
    .txtCopyright, a.txtCopyright {
    	text-align: left;
    	font-family: Verdana, Arial, Helvetica, sans-serif;
    	font-size: 1px;
    	padding-top: 5px;
    	color: #999999;
    }
    a.txtCopyright:hover {
    	text-decoration: none;
    }

    Any help is always apperciated

  • #2
    Senior Coder koyama's Avatar
    Join Date
    Dec 2006
    Location
    Copenhagen, Denmark
    Posts
    1,246
    Thanks
    1
    Thanked 5 Times in 5 Posts
    You need to clear your float. Because of IE, clearing a float has become a science in itself. You may try this:
    Code:
    #pageSurround {
    	background-color: #F2dec6;
    	border: 2px solid red;
    	margin-bottom: 5px;
    	width: 100%;
    	overflow: auto;
    }
    Edit:
    This might not be so good anyway because of your border. Instead of the above, use another method:
    Replace this:
    Code:
    <br clear="all">
    with this
    Code:
    <div style="clear: both; font-size: 0; line-height: 0">&nbsp;</div>

    Last edited by koyama; 02-03-2007 at 01:13 AM. Reason: added information

  • #3
    New Coder
    Join Date
    Feb 2007
    Location
    Arizona
    Posts
    13
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Code:
    width: 100%;
    	overflow: auto;
    That did the trick koyama, seems fine to all my browsers now

    I want to Thank You very much for taking the time to help me, I'm still on the learning curve with So Very Much of this

    Your help's apperciated


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •