SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    [Fixed] Couple of spacing issues in IE

    http://www.wam.umd.edu/~sfiorell/scs/index.htm

    Code:
    body {
    	background: #ffffff url('img/bg.png') top center repeat-y;
    	font: 16px Trebuchet MS, Arial, Helvetica, sans-serif; }
      
    #Main {
    	margin: 2px 112px 0 112px; }
    
    #logo {
    	display: inline;
    	float: left; }
    #info {
    	display: inline;
    	float: right;}
    	
    #MainHeader h2 {
    	font: 18px Trebuchet MS;
    	color: #999999; }
    #MainHeader a {
    	color: #CC0000; }
    #MainHeader a:hover {
    	color: #000000; }
    	
    #MainHeaderBar {
    	clear: both;
    	margin: 0 0 5px 0;
    	background: #ffffff url('img/footerBar.gif') top center repeat-x;
    	color: #000000; }
    	
    #MainTop {}
    #MainTop h3{
    	margin: 0 0 -5px 0;
    	font: 24px Trebuchet MS;
    	color: #CCCCCC; }
    #MainTop h4{
    	margin: -5px 0 0 0;
    	font: 20px Trebuchet MS;
    	color: #CC0000; }
    #MainTop p{
    	width: 254px;
    	margin: 0 0 0 20px; }
    	
    #MainBottom {
    	margin: 0 auto;
    	text-align: left;}
    #MainBottom h3{
    	margin: -10px 0 -5px 0;
    	font: 24px Trebuchet MS;
    	color: #CCCCCC; }
    #MainBottom h4{
    	margin: -5px 0 0 0;
    	font: 20px Trebuchet MS;
    	color: #CC0000; }
    #MainBottom ul{
    	width: 212px;
    	margin: 0 0 0 -25px;
    	list-style-type: none; }
    #MainBottom li{
    	background: url('img/box.gif') no-repeat;
    	background-position: 0 .5em;
    	padding-left: .6em; }
    	
    .topSide, span.topSide {
        position: relative;
    	margin: 0 auto;
        float: left;
        width: 350px;
        height: 90px; }
    
    .sidebyside, span.sidebyside {
        position: relative;
    	margin: 0 auto;
        float: left;
        width: 240px;
        height: 150px; }
    .clear {
        float: none;
        clear: both; }
    
    #MainFooter {
    	font: 14px Trebuchet MS;
    	text-align: center; } 
    #MainFooter a {
    	color: #FFFFFF; }
    #MainFooter a:hover {
    	color: #CC0000; }
    #MainFooter p#fTop {
    	padding: 3px 0 3px 0;
    	background: #ffffff url('img/footerBar.gif') top center repeat-x;
    	color: #000000; }
    #MainFooter p#fBot {
    	margin: -10px;
    	color: #CCCCCC; }
    I was trying to cut down some the whitespace on my site. So I changed the height of my text elements, but it didn't have any effect in IE (It works in FF). The footer also has too much space. In FF I just changed the margin to -10px but again it didn't work in IE. Also I can't seem to get my bulleted elements tabbed in like they are in FF. My html and css all validate so I think it's an IE thing.
    Last edited by sfpiano; May 30, 2007 at 20:08.

  2. #2
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Fixed it by using a text-indent instead of of a margin shift.

    Code:
    #MainBottom ul{
    	width: 212px;
    	margin: -2px 0 0 0;
    	padding-left: 0px;
    	text-indent: 1em;
    	list-style-type: none; }


Bookmarks

Posting Permissions

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