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 4 of 4
  1. #1
    Regular Coder
    Join Date
    Oct 2004
    Posts
    117
    Thanks
    0
    Thanked 0 Times in 0 Posts

    image shows in preview, not in browser

    When I preview my page in firefox on my Mac, (via Dreamweaver's Preview function), I can see the main logo image fine. However, when I uploaded the page and image correctly, I only get a blank area.

    I think this is a css issue, but I can't figure it out.

    http://alpineec.com/TEST/index.php

    Any thoughts?

    CSS
    Code:
    *
    {
    padding: 0em;
    margin: 0em;
    }
    
    body
    {
    background-color:#999999;
    padding: 35px 0px 35px 0px;
    }
    
    body,input
    {
    font-size: 10pt;
    font-family: "georgia", "times new roman", serif;
    color: #333333;
    }
    
    p
    {
    line-height: 1.5em;
    margin-bottom: 1.0em;
    text-align: justify;
    }
    
    a
    {
    color: #B96D00;
    text-decoration: underline;
    }
    
    a:hover
    {
    text-decoration: none;
    }
    
    
    h3 span
    {
    font-weight: normal;
    }
    
    h3,h4
    {
    display: inline;
    font-weight: bold;
    background-repeat: no-repeat;
    background-position: right;
    }
    
    h3
    {
    font-size: 1.7em;
    padding-right: 34px;
    background-image: url('images2/db1.gif');
    }
    
    h4
    {
    font-size: 1.2em;
    padding-right: 28px;
    background-image: url('images2/db2.gif');
    }
    
    .contentarea
    {
    padding-top: 1.3em;
    }
    
    
    
    img.left
    {
    position: relative;
    float: left;
    margin: 0em 1.8em 1.4em 0em;
    }
    
    img.right
    {
    position: relative;
    float: right;
    margin: 0em 0em 1.8em 1.8em;
    }
    
    
    
    .post .details
    {
    position: relative;
    top: -1.5em;
    font-size: 0.8em;
    color: #787878;
    }
    
    .post ul.controls
    {
    clear: both;
    }
    
    .post ul.controls li
    {
    display: inline;
    font-size: 0.8em;
    }
    
    .post ul.controls li a
    {
    background-repeat: no-repeat;
    background-position: left;
    padding: 0em 1.0em 0em 20px;
    }
    
    .post ul.controls li a.printerfriendly
    {
    background-image: url('images2/icon-printerfriendly.gif');
    }
    
    .post ul.controls li a.comments
    {
    background-image: url('images2/icon-comments.gif');
    }
    
    .post ul.controls li a.more
    {
    background-image: url('images2/icon-more.gif');
    }
    
    .box
    {
    position: relative;
    background: #FDFCF6 url('images2/boxbg.gif') repeat-x;
    left: -1.5em;
    top: -1.5em;
    padding: 1.5em;
    border-bottom: solid 1px #E1D2BD;
    margin-bottom: 1.0em;
    }
    
    ul.linklist
    {
    list-style: none;
    }
    
    ul.linklist li
    {
    line-height: 2.0em;
    }
    
    #upbg
    {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 275px;
    background-color:#999999;
    z-index: 1;
    }
    
    #outer
    {
    	z-index: 2;
    	position: relative;
    	/*
    	The width value below controls the overall width of the design. By default it's set to 82%
    	(so it'll take up 82% of the browser window's width). You can set it to a different percentage
    	value (70%, 90%, etc.) or even a pixel value (760px, 800px, etc.) to enforce a fixed width.
    */
    width: 700px;
    	border: solid 1px #fff;
    	background-color: #fff;
    	margin: 0 auto;
    }
    
    #header
    {
    position: relative;
    width: 100%;
    
    background: #5a5a5a;
    }
    
    #headercontent
    {
    	position: absolute;
    	bottom: -56px;
    	padding: 0em 2.0em 1.3em 2.0em;
    	left: 274px;
    }
    
    #headercontent h1
    {
    font-weight: normal;
    color: #fff;
    font-size: 2.5em;
    }
    
    #headercontent h1 sup
    {
    color: #777;
    }
    
    #headercontent h2
    {
    font-size: 1.0em;
    font-weight: normal;
    color: #aaa;
    }
    
    
    #menu
    {
    position: relative;
    background: url('images2/menubg.jpg') repeat-x top left;
    height: 20px;
    padding: 0em 1.0em 0em 1.0em;
    }
    
    #menu ul
    {
    	position: absolute;
    	top: 2px;
    }
    
    #menu ul li
    {
    position: relative;
    display: inline;
    }
    
    #menu ul li a
    {
    padding: .5em 1.0em 0.9em 1.0em;
    color: black;
    text-decoration: none;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
    }
    
    #menu ul li a:hover
    {
    text-decoration: none;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
    color: #FE3D00;
    }
    
    #menu ul li a.active
    {
    text-decoration: none;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
    color: #FE3D00;
    }
    
    #content
    {
    padding: 0em 2.0em 0em 2.0em;
    }
    
    #primarycontainer
    {
    float: left;
    margin-right: -18.0em;
    width: 100%;
    }
    
    #primarycontent
    {
    margin: 1.5em 22.0em 0em 0em;
    }
    
    #secondarycontent
    {
    margin-top: 1.5em;
    float: right;
    width: 18.0em;
    }
    
    #footer
    {
    position: relative;
    height: 2.0em;
    clear: both;
    padding-top: 5.0em;
    background: #fff url('images2/border2.gif') repeat-x 0em 2.5em;
    font-size: 0.8em;
    }
    
    #footer .left
    {
    	position: absolute;
    	left: 191px;
    	bottom: 1.2em;
    	z-index: 10;
    }
    
    #footer .right
    {
    position: absolute;
    right: 2.0em;
    bottom: 1.2em;
    }
    
    
    pre {
     padding:10px;
     border: 1px dotted #eee;
     background-color:#f9f9f9;
    }
    
    
    #photodiv {
      background-repeat: no-repeat;
    }
    
    #aboutBLOCK{padding-left:40px;}
    
    /* PHOTO GALLERY */
    #pg {
    border:2px dotted #666;
    padding:5px;
    padding-top:15px;
    }
    #pg ul {
    list-style:none; 
    left: 10px;
    padding:0; 
    margin:0; 
    position:relative; 
    float:left;
    }
    #pg ul li {
    display:inline; 
    float:left; 
    margin:0 0 8px 8px;
    }
    #pg ul li a {
    display:block; 
    width:90px; 
    height:90px; 
    	text-decoration:none; 
    border:1px solid #000;
    }
    #pg ul li a img {
    display:block; 
    width:90px; 
    height:90px;
    border:0;
    }
    #pg ul li a:hover {
    white-space:normal; 
    border-color:#336600;
    background-color:#323E20;
    }
    #pg ul li a:hover img {
    position:absolute; 
    left: 290px;
    top:110px; 
    width:300px; 
    height: 300px; 
    border:1px solid #000;
    }
    #pg ul li a span {display:none}
    #pg ul li a:hover span {
    display:block;
    position:absolute; 
    left:9px; 
    top:110px; 
    width:270px; 
    height:auto;
    font-size:12px;color: black;
    }

  • #2
    Regular Coder
    Join Date
    Jul 2008
    Posts
    136
    Thanks
    18
    Thanked 0 Times in 0 Posts
    Which image isn't showing?

  • #3
    Regular Coder FWDrew's Avatar
    Join Date
    Apr 2008
    Location
    Missouri
    Posts
    380
    Thanks
    38
    Thanked 45 Times in 43 Posts
    Code:
    images/main_logo_noglow
    What kind of file type is your image, it is not specified in your code. This may be your problem.

    Regards,

    Drew
    Dev-Tips.com || Employee at the Envato Network || My Portfolio

  • #4
    Regular Coder
    Join Date
    Oct 2004
    Posts
    117
    Thanks
    0
    Thanked 0 Times in 0 Posts
    wow I am dumb. that was it...no extension.

    thanks guys.


  •  

    Posting Permissions

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