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 2 of 2

Thread: IE 7 Problems

  1. #1
    New Coder
    Join Date
    Jul 2008
    Posts
    64
    Thanks
    9
    Thanked 0 Times in 0 Posts

    IE 7 Problems

    If you view http://bonaventurafertility.com/drbonaventura.php
    and view all the other staff members in Firefox, Safari, IE6, etc it lines up perfectly fine. Once in IE7 it gets screwy. I haven't been working on this project but I was wondering if anyone could help me with this problem.

    The following is a screenshot if the doctors and staff page in IE7:
    IE 7 Problems-bonascreenshot.jpg


    hope someone can help!

  • #2
    Regular Coder Pepe, the bull's Avatar
    Join Date
    Feb 2005
    Location
    Vancouver, WA
    Posts
    163
    Thanks
    1
    Thanked 16 Times in 16 Posts
    Using the IE Developer Toolbar, it looks like your imgFloatRight div and bodyTextWide divs are too wide to be next to each other. You could scoot the picture to the right a little by changing the padding of imgFloatRight to 30% instead of 33%.

    Code:
    div.imgFloatRight, .imgFloatRight2
    {
    	float: right;
    	margin-top: 3%;
    	padding-right: 30%;
    }
    I noticed that the sublinks2 div is also off, and in trying so see if I could fix that (I was bored), it messed up the text. I think you should float the sublinks2 and the image. Here is the CSS that I think worked.
    Code:
    /****************************************************
    
    colors
    #EFF0F7		body background
    #798FDB		sublinks background
    
    ****************************************************/
    html
    {
    	min-height: 100%;
    	height: auto;
    }
    
     /*
      USAGE: All you have to do is include this one line in your CSS file, with the
      tag names to which you want the script applied:
     */
    
    img, div { behavior: url(/css/iepngfix.htc) }
    
     /*
      Alternatively, you can specify that this will apply to all tags like so:
       * { behavior: url(iepngfix.htc) }
     */
    
    body,html {
    	margin: 0;
    	width: 100%;
    	font-family: arial, helvetica, sans-serif;
    	font-size: 12px;
    	background-color: #EFF0F7;
    	/* Added fix for hover over anything, not just <a> in ie6 , csshover.htc
    	from http://www.xs4all.nl/~peterned/csshover.html */
    	behavior: url(/css/csshover.htc)
    }
    
    a {
    	color: #FFFFFF;
    	text-decoration: none;
    	font-family: arial, helvetica, sans-serif;
    	font-size: 12px;
    }
    
    a:hover {
    	text-decoration: underline;
    }
    
    a.inline {
    	color: #000000;
    	text-decoration: underline;
    	font-family: arial, helvetica, sans-serif;
    	font-size: 12px;
    }
    
    a.inline:hover {
    	text-decoration: underline;
    }
    
    h1, h2, h3, h4, h5, h6 {
    	margin: 0 0 0 5px;
    	padding: 10px 0 0 0;
    }
    
    h1 {
    	font-size: 150%;
    }
    
    h2 {
    	font-size: 130%;
    }
    
    h3 {
    	font-size: 110%;
    }
    
    p {
    	margin: 0 0 0 5px;
    	padding: 3px 0 3px 0;
    	text-align: justify;
    }
    
    ul {
    	list-style-type: disc;
    }
    
    ul li {
    	margin: 0 0 0 5px;
    	padding: 2px 0 2px 0;
    }
    
    #catchphrase {
    	float: right;
    	position: relative;
    	top: 91px;
    }
    
    #toolbar {
    	background-color: #465CA8;
    	height: 31px;
    	padding-left: 20px;
    	width: 100%;
    }
    
    #header {
    	margin: 0;
    	padding-top: 10px;
    	height: 125px;
    	background: #FFFFFF;
    }
    
    #headerinnards {
    	margin: 10px;
    	width: 760px;
    }
    
    #flashArea {
    	float: left;
    	padding-left: 20px;
    }
    
    #nav {
    	margin: 0;
    	padding: 10px 0 10px 20px;
    	background-color: #465CA8;
    	color: white;
    }
    
    .currentLink {
    	text-decoration:underline;
    }
    
    #subLinks {
    	margin: 0;
    	padding: 5px 0 5px 40px;
    	color: #FFFFFF;
    	cursor: default;
    	background-color: #798FDB;
    }
    
    #subLinks2 {
    	position: relative;
    	float:left;
      width:15%;
    	margin:0;
    	padding: 2% 0 0 2%;
    }
    
    #subLinks2 a {
    	color: #690369;
    }
    
    #contentholder {
    	width: 100%;
    	background: #DEE0EE url('../images/leftbgback.jpg') left top repeat-y;
    }
    
    #content {
    	width: 100%;
    	min-height: 442px;
    	background: url('../images/leftbg.jpg') left top no-repeat;
    }
    
    #bodytext {
    	font-family: arial, helvetica, sans-serif;
    	font-size: 12px;
    	width: 25%;
    	margin: 0 0 0 17%;
    	padding: 5px 10px 30px 5px;
    }
    
    #bodytextWide {
    	font-family: arial, helvetica, sans-serif;
    	font-size: 12px;
    	width: 35%;
    	margin: 0 0 0 18%;
    	padding: 5px;
    }
    
    #bodytext a, #bodytextWide a {
    	color:#465CA8;
    	text-decoration:underline;
    }
    
    #footer {
    	clear: both;
    	padding: 2px;
    	background: #465CA8;
    }
    
    .address {
    	text-align: center;
    	height: 20px;
    	color: white;
    	font-size: 9px;
    	margin: 0;
    	padding: 5px 0 5px 40px;
    }
    
    div.imgFloatRight, .imgFloatRight2
    {
    	float: right;
    	width:40%;
    	margin:0;
    	padding-top:2%;
    }
    
    .imgFloatRight img
    {
    	border: 1px solid mediumSlateBlue;
    }
    
    /****************************************************
    
    
    ****************************************************/
    Last edited by Pepe, the bull; 07-11-2008 at 08:53 PM.
    Pepe, the bull


  •  

    Posting Permissions

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