Expression Web 4 - pics don't show in prog but do on web?

Associate
Joined
3 Mar 2010
Posts
1,183
Location
Staffordshire
Hi all,

I use expression web 4 and when I add a picture to a web page and then use the preview in browser option the picture shows in Chrome, Firefox etc. but doesn't show in IE9. Yet when I upload the files to the web the pictures show just fine. Anyone else come across this problem or knows what the answer is? Thanks, Ian.
 
Permissions allow set restrictions to groups/users, usually read, write and execute. Could you paste your code, i can test it in various browsers.
 
Permissions allow set restrictions to groups/users, usually read, write and execute. Could you paste your code, i can test it in various browsers.

Thanks Rob,
This is the code so far:

CSS Code:

Code:
/* Timothy Framework - www.timothyframework.com */
/* This work is licensed under the MIT License - http://www.opensource.org/licenses/mit-license.php */


/* Color Legend */


/* Reset */

html, body { border-style: none;
	border-color: inherit;
	border-width: 0;
	margin: 0;
	padding: 0;
background-image:url('../images/bg/olive-bg.jpg'); 
	font-size:10px; }

div, span, article, aside, footer, header, hgroup, nav, section,
h1, h2, h3, h4, h5, h6, p, blockquote, a, ol, ul, li, 
table, tr, th, td, tbody, tfoot, thead {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	background: transparent;
	}

img 	{ margin:0; padding:0; border:0; }

table, tr, th, td, tbody, tfoot, thead {
	margin: 0; padding: 0; border: 0;
	vertical-align: baseline;
	background: transparent;
	}
	
table { border-collapse: collapse; border-spacing: 0; }
	
input, select, textarea, form, fieldset {
	margin: 0; padding: 0; border: 0;
	}

article, aside, dialog, figure, footer, header, hgroup, nav, section { 
	display:block; }

h1, h2, h3, h4, h5, h6, p, li, blockquote, td, th, a, caption, em, strong, strike { 
	font-family:  Arial, Helvetica, sans-serif;
	font-size:100%;
	font-weight: normal;
	font-style: normal;
	line-height: 100%; 
	text-indent: 0;
	text-decoration: none;
	text-align: left;
	color: #000;
	}


/* Global */

html 	{	}
body		{ 	}



/* Headings */

h1, h2, h3, h4, h5, h6 { font-weight: bold; color: #000; 
					font-family: Arial, Helvetica, sans-serif; }

h1 { font-size:24px; }
h2 { font-size:20px; }
h3 { font-size:16px; }
h4 { font-size:14px; margin:10px 0 0 0; }
h5 { font-size:12px; font-weight:normal; }
h6 { font-size:14px; }

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; }



/* Text Elements */

p           	{ color:#000; font-size:12px; line-height:150%;  }
p .left		{ margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p .right 		{ margin: 1.5em 0 1.5em 1.5em; padding: 0; }

a           	{ font-weight:normal;  }
a:link		{ color: #56562C;  }
a:visited		{ color: #56562C;  }
a:active		{ color: #56562C;  }
a:focus		{ color: #AEAE5E; text-decoration:underline;  }
a:hover     	{ color: #AEAE5E; text-decoration:underline; }

blockquote  	{ color:#000; font-size:12px; }

strong      	{ font-weight: bold; }
em		     { font-style: italic; }

/* Images */



/* Lists */

ul          	{  }
ol          	{ list-style-type:decimal; }
ul p			{ font-weight:normal }

ul li		{ color:#000; font-size:12px; font-family:Arial, Helvetica, sans-serif; }
ol li	     { color:#000; font-size:12px; font-family:Arial, Helvetica, sans-serif; }

dl          	{  	}
dt       		{  	}
dd          	{ 	}



/* Tables */

table       	{ width:100%; }

tr			{	}
.odd			{ background-color:#eee; }
.even		{ background-color:#fff; }

th          	{ font-weight: bold; }
thead, th    	{ background: #ccc; }

tbody		{   }

th,td,caption 	{ 	}
caption 		{ 	}

tfoot       	{	}
.tfooter		{ background-color:#ccc; text-align:center; font-style:italic; }

caption     	{ background: #efefef; }



/* Miscellaneous */

sup, sub    	{ line-height: 0; }

abbr, acronym  { border-bottom: 1px dotted #666; }
address     	{ 	 }
del         	{ background:#FFCECE; color:#f00; }

code, pre		{ background-color:#FF9; padding:2px 0px; margin:4px 25px;
					font-family:"Courier New", Courier, monospace; font-size:12px; font-weight:normal; line-height:150%;	}


/* Containers */

#wrapper 			{ width:900px; margin:0px auto; padding:20px 40px;
					background-color:#F0F0E1; border-top:2px #666666 solid; }

#topnav 			{ width:900px; margin:5px 0px 5px 0px;  text-align:center; background-color:#f0f0e1; }
#topnav ul			{ width:100%; background-color:#999999; padding:10px 0 10px 0; border-bottom:1px black solid; border-top:1px black solid;	}
#topnav ul li		{ display:inline;	}
#topnav ul li a		{ padding: 9px 20px 9px 20px; 
					font-family:Arial, Helvetica, sans-serif , 
					font-size:16px; font-weight:normal; }
					
#topnav a:link		{ color:#FFFFFF	}
#topnav a:visited	{ color:#FFFFFF;	}
#topnav a:active	{ color:#FFFFFF;	}
#topnav a:hover		{ color:#FFFFFF; background-color:#770000;	}
#topnav a:focus		{ color:#FFFFFF;	}

#social-media		{ float:left; width:135px; margin-top:0px;   }
#social-media ul li	{ display:inline; }
#social-media img	{ width:24px; height:32px; margin-left:10px; }

#top	 			{ padding:10px 0px; border-bottom:3px #444 solid; margin:10px 0px;  }


#banner 			{  margin-top:0px; float:left; width:auto; white-space:nowrap; }
#banner h1			{font-weight:normal;margin-top:4px;}
#banner h2			{float:left;font-weight:normal;font-size:16px;margin-top:6px;}
#banner h3			{text-align:right;margin-right:0px;margin-top:10px;font-size:12px;}

#top-banner-text 	{ font-family: Arial, Helvetica, sans-serif;
					font-size:26px; font-weight:bold;
					line-height:120%;	}
					
#top-banner  {display:inline}
					
					
#btm-banner-text 	{ font-family: Arial, Helvetica, sans-serif;
					font-size:24px; font-weight:bold; 	}
					
#btm-banner			{  }					

#subbanner 		{ width:900px; float:right; }
#subbanner h2		{ font-size:22px; line-height:150%; margin-top:20px; font-weight:normal; }

#bottom			{ padding:0px 0px 0px 0px; width:100%; height:2px;
					border-top:1px #aaa solid; margin:60px 0px 0px 0px; }

#rightside 		{ width:200px; float:right; padding:0 0 0 20px; border-left: 1px #C0C0C0 solid;  }
#rightside h2		{ font-size:28px; font-weight:bold; 
					margin:0px 0px 25px 0px; }
#rightside h3		{ font-size:16px; font-weight:bold; 
					margin:20px 0px 10px 0px; }
#rightside p		{ font-family:Arial, Helvetica, sans-serif; font-size:13px; font-weight:normal;
					line-height:150%; margin-bottom:12px; }
					
					
					
#rightside li		{ margin:10px 0 10px 30px; Padding:0 0 0 3px; font-size:13px; }
#rightside img		{ margin:10px 0px; border:10px #fff solid; padding:1px; }

#content 			{ width:700px; float:left;  }
#content h2		{ font-size:36px; font-weight:bold; 
					margin:40px 0px 20px 0px; }
#content li		{ margin-left:30px; margin-bottom:5px;
					 list-style-type:square; line-height:120%; font-size:12px; }
					
#content p		{ line-height:120%; margin:0px 0px; font-size:12px; font-weight:normal;
					font-family:Arial, Helvetica, sans-serif; }
				
#content h5		{ font-weight:normal; }


#content ul li a	{ line-height:120%; margin:5px 0px; font-size:12px; font-weight:normal;
					font-family:Arial, Helvetica, sans-serif; }
					
#content a:link		{ color:#000000;	}
#content a:visited	{ color:#000000;	}
#content a:active	{ color:#000000;	}
#content a:hover	{ color:#FFFFFF; background-color:#770000;	}
#content a:focus	{ color:#000000;	}


#footer 			{ clear:both; margin-top:20px; border-top:1px #555 solid; padding-top:20px; }   }


#box1 {   }

#box2 {   }

#box3 {   }

#box4 {   }

#box5 {   }

#box6 {   }


/* Layout Extra */




/* Navigation Extra */



/* Forms */

form ol { list-style-type:none; }

form 	{ text-align:left; margin:20px;	}

label 	{ 
		float: left; width: 150px; margin-top:5px;
		text-align:right; display:block; background:none; font-weight:bold;
		}
	
submit	{ background:none; 	}

input 	{ 
		width: 280px; margin:0 0 16px 10px;
		border:1px #bbb solid; padding:5px; background:none; 
		}
		
input:focus, textarea:focus	{ background-color:#BFEBFF; }

textarea {
		width: 280px; height: 150px; margin:0 0 16px 10px;
		border:1px #bbb solid; padding:5px; background:none; 
		}

select { margin-bottom:20px;	}
	
.month { margin-left:155px;	}

.submit {
		width:90px; height:25px;
		margin-left:160px;
		font-size:12px;
		}

br		{ clear: left; 	}

.clear	{ clear:both; }


/* Miscellaneous  */

.copyright-text	{ font-size:80%; font-style:italic; color:#333; }
.footer-text		{ font-size:12px; font-style:normal; color:#333; text-align:center; }

.title			{ font-size:18px; font-weight:bold; color:#333;  }
.subtitle			{ font-size:14px; font-style:italic; color:#333;  }

.artist			{ font-size:16px; font-weight:bold; color:#333;  }
.author			{ font-size:14px font-weight:bold; color:#555;  }
.editor			{ font-size:14px font-style:italic; color:#555;  }

.pub-date			{ font-size:10px font-style:italic; color:#555; }
.article-date		{ font-size:10px font-style:italic; color:#555;  }
.location			{ font-size:10px font-style:italic; color:#555;  }

.float-right		{ float:right; }
.float-left		{ float:left; }
.clear			{ clear:both; }

.hide			{ display:none; }
.block			{ display:block; }
.inline			{ display:inline; }

.first			{ font-weight:bold; }
.last			{ font-weight:bold; }
.left			{ font-weight:bold; text-align:left; }
.right			{ font-weight:bold; text-align:right; }

.added      	{ background:#D7D7FF; }
.removed    	{ background:#FFCECE; color:#f00; }
.changed		{ background:#FFB; }


/* Success, info, notice and error/alert boxes - from Blueprint CSS Framework */

.error, .alert, .notice, .success, .info {
	padding: 0.8em; margin-bottom: 1em; border: 2px solid #ddd; }

.error, .alert 	{ background: #fbe3e4; color: #8a1f11; border-color: #fbc2c4; }
	
.notice			{ background: #fff6bf; color: #514721; border-color: #ffd324; }
	
.success   		{ background: #e6efc2; color: #264409; border-color: #c6d880; }
	
.info 			{ background: #d5edf8; color: #205791; border-color: #92cae4; }
	
.error a 	{ color: #8a1f11; }
.alert a 	{ color: #8a1f11; }
	
.notice a   { color: #514721; }
.success a  { color: #264409; }
.info a		{ color: #205791; }

HTML Code:
Code:
<!DOCTYPE HTML><html>
<!-- #BeginTemplate "main.dwt" -->
<head>
	<meta content="revealTrans(Duration=1.0,Transition=12)" http-equiv="Page-Enter">
	<script type="text/javascript" src="js/jquery.js"></script>
     <script type="text/javascript" src="js/timothy.js"></script>
	<script src="js/media-gallery.js" type="text/javascript" charset="utf-8"></script>
     
	<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700' rel='stylesheet' type='text/css'>
     
     <link href="css/styles.css" rel="stylesheet" type="text/css" media="screen">
     <link href="css/print.css" rel="stylesheet" type="text/css" media="print">
     
     <link rel="stylesheet" href="css/media-gallery.css" type="text/css" media="screen">

	<script type="text/javascript" charset="utf-8">
      $(document).ready(function(){
        $("a[rel^='gallery']").prettyPhoto({ overlay_gallery: false, });
        
      });
    </script>
     
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <meta http-equiv="Content-Type" content="cache" />
     
     <META name="robots" content="NOINDEX, NOFOLLOW, NOYDIR, NOODP, NOARCHIVE" />
     <META name="googlebot" content="NOARCHIVE, NOODP, NOSNIPPET" />
     <META name="slurp" content="NOARCHIVE, NOYDIR, NOSNIPPET" />
     
     <meta name="robots" content="noimageindex">
<!-- #BeginEditable "doctitle" -->
<title>Timothy Framework - Learning Tutorials and Video Courses</title>
     <!-- #EndEditable -->
     <meta name="keywords" content="Framework HTML CSS JavaScript dreamweaver expression web" />
     <meta name="description" content="A Professional Easy To Use Web Design Framework For Learning To Build Websites" />

<!-- Google Analytics Code Goes Below Here -->
	<script type="text/javascript">
     
       var _gaq = _gaq || [];
       _gaq.push(['_setAccount', 'UA-5475445-22']);
       _gaq.push(['_trackPageview']);
     
       (function() {
         var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
         ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
         var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
       })();
     
     </script>    
    <!-- End Google Analytics Code -->
	
<link rel="stylesheet" href="css/olive.css"  type="text/css" media="screen">
	<style type="text/css">
	.auto-style2 {
		margin-left: 24px;
		
		margin-right: 0;
	}
	.auto-style3 {
		margin-bottom: 12px;
	}
	.auto-style4 {
		font-size: large;
		font-family: Arial;
		letter-spacing: 1px;
	}
	.auto-style8 {
		text-align: justify;
	}
	.auto-style10 {
		font-variant: small-caps;
	}
	.auto-style11 {
		font-family: Arial;
		font-size: medium;
	}
	.auto-style12 {
	font-size: x-small;
	font-style: normal;
	color: #333;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}
	</style>
</head>

<body>

<div id="wrapper">
	
  
     
     
       
<div id="banner" style="width:900px;">

   			<h1 class="auto-style4">&nbsp;<img alt="Outwoods Parish Council Logo" height="48" src="New%20Banner%20Logo-psd.png" width="889"></h1>
  			
</div>

  		 

   
<div id="bottom">
     
        <div id="topnav" style="width: 900px">
          <ul>
               <li class="auto-style10">
			   <a class="auto-style11" href="index.html">home</a></li>
			   <li class="auto-style10">
			   <a class="auto-style11" href="members.html">members</a></li>
			   <li class="auto-style10">
			   <a class="auto-style11" href="news.html">news</a></li>
			   <li class="auto-style10">
			   <a class="auto-style11" href="meetings.html">meetings</a></li>
			   <li class="auto-style10">
			   <a class="auto-style11" href="contact.html">contact</a></li>
			   <li class="auto-style10">
			   <a class="auto-style11" href="scams.html">scams</a></li>
			   <li class="auto-style10">
			   <a class="auto-style11" href="trades.html">trades</a></li>
			 

          </ul>
     </div>
     
     
<div id="subbanner" style="width:900px;">

             <img alt="outwoods pictures" src="images/media-gallery/logo%20-900%20x%20120.jpg" height="100" width="900">

</div>

     
     
<div id="rightside" style="width: 225px" class="auto-style2">
			 <!-- #BeginEditable "rightside" -->
			 <h3>Council Information</h3>
			 <ul>
				 <li><a href="hot_topics.html">Hot Topics</a></li>
				 <li><a href="recycling.html">Recycling</a></li>
				 <li><a href="standing_orders.html">Standing Orders</a></li>
				 <li><a href="2012_agenda.html">2012 Agenda</a></li>
				 <li><a href="2012_minutes.html">2012 Minutes</a></li>
				 <li><a href="2011_minutes.html">2011 Minutes</a></li>
				 <li><a href="useful_information.html">Useful Information</a></li>
			 </ul>
			
			 <p class="auto-style8">Click any of the above links to see that 
			 information in a new window.</p>
			 <h3>&nbsp;</h3>
			 <h3>Our Team Members</h3>
			 
			 	<ul>
				<li>Kay Lear</li>
				<li>David Browning</li>
				<li>Ro Dutton</li>
				<li>Tom Foster</li>			
				<li>Michael Rodgers</li>
				<li>Trevor Hathaway</li>
				<li>Liam Elmore</li>
				<li>June Thompson</li>
				<li>John Anderson</li>
				<li>Ian Wright</li>
			</ul>

			 
			 <h3>&nbsp;</h3>
			 <h3>Our Location </h3>
			 <p class="auto-style8">We usually meet at the Outwoods School but this can be subject to change from time to time due to unforeseen circumstances.  
			 To keep up to date with meetings; place and time, please see the Meetings page which can be found on the menu above. 
			 This will be kept up to date and as accurate as possible.
			 </p>
			 <p>&nbsp;</p>
		 <!-- #EndEditable -->
		 </div>
	   
     </div>
     
     <div id="content" style="width: 630px">
<h3>&nbsp;</h3>
		 <!-- #BeginEditable "content" -->
		 <h3>The Parish</h3>
		 <p>&nbsp;</p>
     	<p style="height: 38px">The Outwoods parish is a somewhat disjointed Parish within the Borough 
	 of East Staffordshire with some 1805 electors (figure correct as at 
	 1-12-2010)&nbsp;</p>
	 
	 			<h4 class="auto-style3" style="height: 16px"><strong>The Parish covers the following areas:</strong></h4>
			<h4><strong>Outwoods South:</strong></h4>

		<ul>
			<li>Lower Outwoods Road</li>
			<li>St Georges Road</li>
			<li>St Margarets</li>
		</ul>
			
			
		 <h4><strong>Outwoods North:</strong></h4>
		
		<ul>
		
			<li>Beam Close</li>
			<li>Beamhill Road</li>
			<li>Fields Lane</li>
			<li>Forest Edge Way</li>
			<li>Furrows Drive</li>
			<li>Green Valley Drive</li>
			<li>Harehedge Lane</li>
			<li>Kitling Greaves Lane</li>
			<li>Outwoods Lane</li>
			<li>Rolleston Road</li>
			<li>Tutbury Road</li>
			<li>Forest Road</li>
			<li>Henhurt Hill</li>
					
		</ul>
		
		<p>&nbsp;</p>
		 <p>The Parish Council welcomes the input of its Parishioners and is willing to offer its assistance in an attempt to resolve any relevant issues that require attention/resolution.</p>
		<p>Please contact the Clerk in the first instance to report your concerns.</p>
		 <p>&nbsp;</p>
		<p>We currently have 4 vacancies on the Parish Council in the Outwoods North division. Further information is available by contacting the Clerk if you have an interest in contributing to the work of Outwoods Parish Council.</p>
		 <p>&nbsp;</p>
		
		<ul>
		<li><a href="mailto:%20%20%[email protected]">Please click here 
		to contact the Outwoods Parish Clerk</a></li>
		</ul>
		 <p>&nbsp;</p>
		 <p>If you would like to contribute to the web site or make any comments</p>
		 <p>&nbsp;</p>
		 
		 <ul>
		 <li><a href="mailto:[email protected]">Please click here to send your message</a></li>
		 </ul>


          <h3>&nbsp;</h3>
		 <h3>Any Other Business</h3>
		 <p>&nbsp;</p>
          <p>This is an area for any other information to be placed.</p>
		 <p>&nbsp;</p>
		 <p>&nbsp;</p>
		 <p>&nbsp;</p>
		 <p>&nbsp;</p>
		 <p>&nbsp;</p>
		 <p>&nbsp;</p>
       
          <p>&nbsp;</p>
<!-- #EndEditable -->
</div>
     
     <div id="footer">
     <p class="auto-style12">&copy;Copyright 2012 Outwoods Parish Council - Web Design by 
	 <a href="http://www.imw54.co.uk" target="_blank">www.IMW54.co.uk</a></p>
     </div>
        
   </div>

</body>
<!-- #EndTemplate -->
</html>

<!-- Timothy Framework - www.timothyframework.com -->

<!-- This work is licensed under the MIT License - http://www.opensource.org/licenses/mit-license.php -->
 
Hi Rob,

I dont have a problem with them loading to site or showing up properly when on my site.

The problem is with Expression Web 4. When I try to preview in Expression Web 4 they don't show in IE9 but they do in Chrome, Firefox etc.
 
Hi Rob,

That second link is a cracker, I will certainly be spending a bit of time on there.
When I preview I go to File > Preview in browser > and the check in the 4 browsers I have loaded. ie: IE9, Firefox, Chrome and Apple Safari.
I think this is just a bug in Expression Web, I can live with it as long as they work when uploaded:).

Thanks for all your time and help Rob and I really appreciate those links, Cheers, Ian.
 
Back
Top Bottom