SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Guru adammc's Avatar
    Join Date
    Aug 2004
    Location
    Cairns, Australia
    Posts
    762
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Help with browser probs

    Hi folks,

    I am having trouble getting the header of my site to show correctly in IE & Firefox.

    Below is the css code and html for my logo and flash slideshow that sits next to it. They equal a total width of 770px
    This loads perfectly in IE but in Firefox it puts the flash on a new paragraph (sees it as being too wide)

    Can anyone possible help me solve this?

    Code:
      
    #wrapper - main table
    {
    	background:#FFF;
    	text-align:left;
    	margin:auto;
    	width:770px;
    	border:1px solid #FFFFFF;
    
    
    #banner
    {
    	border-top:1px solid #FFFFFF;
    
    }

    Code:
    <div id="banner" align="top" align="left">
    
    <img src="main.jpg" alt="" width="400" height="172" />
    
    <object type="application/x-shockwave-flash" data="flash/SlideShow.swf" width="370" height="172">
    <param name="movie" value="flash/Slideshow.swf" />
    <param name="quality" value="high" />
    <a title="You must install the Flash Plugin for your Browser in order to view this movie"  href="http://www.macromedia.com/shockwave/download/alternates/"></a>
    </object>
    
    </div>

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    - main table

    needs to be commented. It should look like:

    /* - main table */

  3. #3
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Also keep in mind I just glanced at it.

  4. #4
    SitePoint Guru adammc's Avatar
    Join Date
    Aug 2004
    Location
    Cairns, Australia
    Posts
    762
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Dan,


    the text - main table doesnt exist in my code, I just popped it in so people on the board would know what it is for.

    Any other ideas?

  5. #5
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can you show me the full HTML and CSS for the page?

  6. #6
    SitePoint Guru adammc's Avatar
    Join Date
    Aug 2004
    Location
    Cairns, Australia
    Posts
    762
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sure

    Header part of html

    <body>

    Code:
    <div id="wrapper">
    	<div id="header">
    		<div id="logo"><a href="index.html"><img src="images/header-text.gif" alt="" /></a></div>
    		
    <a href="#skiptonav" class="hideme">Skip to Navigation</a></div>
    
    
    	<div id="banner" align="top" align="left">
    
    <img src="images/main.jpg" alt="" width="400" height="172" />
    
    <object type="application/x-shockwave-flash" data="flash/SlideShow.swf" width="370" height="172">
    <param name="movie" value="flash/Slideshow.swf" />
    <param name="quality" value="high" />
    <a title="You must install the Flash Plugin for your Browser in order to view this movie"  href="http://www.macromedia.com/shockwave/download/alternates/"></a>
    </object>
    
    	</div>
    
    
    	<div id="container">
    		<div id="main">
    			<div id="content">
    				<h1>Welcome</h1>

    relevant css


    Code:
    body
    {
    	font-size:80%;
    	background:#669966 url("images/header-background.gif");
    	background-repeat:repeat-x;
    	color:#000;
    	font-family:arial,verdana,helvetica,sans-serif;
    	text-align:center;
    	margin:0;
    	padding:0;
    }
    
    #wrapper
    {
    	background:#FFF;
    	text-align:left;
    	margin:auto;
    	width:770px;
    	border:1px solid #FFFFFF;
    }
    #header
    {
    	background-image:url("images/header-text-bg.jpg");
    	background-repeat:repeat-x;
    	height:55px;
    }
    
    #container
    {
    	background-image:url("images/navigation_bg.gif");
    	background-repeat:no-repeat;
    	width: 100%;
    	float:left;
    }
    
    #banner
    {
    	border-top:1px solid #FFFFFF;
    
    }
    
    
    #main
    {
    	width: 100%;
    	float: right;
    	margin-left: -230px;
    	padding:0px 0px 20px 0px;
    }
    #content
    {
    	margin-left: 220px;
    	padding:1px 15px 15px 15px;
    	font-family:verdana, arial, helvetica, sans-serif;
    	line-height:1.8em;
    	font-size:0.85em;
    }
    
    #content a, #content a:visited, #footer a, #footer a:visited
    {
    	color:#093280;
    }
    
    #content a:hover, #footer a:hover
    {
    	color:#009933;
    }
    
    #contentleft
    {
    	float:left;
    	width:240px;
    }
    [/code]

  7. #7
    SitePoint Guru adammc's Avatar
    Join Date
    Aug 2004
    Location
    Cairns, Australia
    Posts
    762
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Dan... I fixed it

    I removed the space between:

    <img src="main.jpg" alt="" width="400" height="172" />

    and
    <object type="application/.....

    result:
    <img src="main.jpg" alt="" width="400" height="172" /><object type="application/...

    Looks perfect in IE 7 and Firefox


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
  •