Forums
This topic is locked
Good in brouswers, but not ok in Dreamweaver
Posted 14 Jun 2007 21:21:42
1
has voted
14 Jun 2007 21:21:42 Elvis Parsley posted:
Hi, I have the following CSS codes in <head> and html in <body>. It looks good in browers (IE7 and Firefox). However when I put in the Dreamweaver, it is not what I see in browsers. Is thereanyone can tell me why?--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
<html xmlns="www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title> Stu Nicholls | CSSplay | An Active Photograph Gallery</title>
<meta name="Keywords" content="" />
<link rel="stylesheet" media="all" type="text/css" href="../css/css_play.css" />
<link rel="stylesheet" media="all" type="text/css" href="../css/demos.css" />
<style type="text/css">
/* needed for IE to make :active state work first time */
a, a:visited {color:#000;}
/* common styling for all galleries */
a.gallery, a.gallery:visited {display:block; display:inline-block; color:#000; text-decoration:none; border:1px solid #000; width:75px; height:47px; float:left; margin:4px; z-index:50;}
a.slidea {background:url(Hildephotos/pic10thumb1.jpg);}
a.slideb {background:url(Hildephotos/pic11thumb1.jpg);}
a.slidec {background:url(Hildephotos/pic2thumb1.jpg);}
a.slided {background:url(Hildephotos/pic3thumb1.jpg);}
a.slidee {background:url(Hildephotos/pic4thumb1.jpg);}
a.slidef {background:url(Hildephotos/pic5thumb1.jpg);}
a.slideg {background:url(Hildephotos/pic6thumb1.jpg);}
a.slideh {background:url(Hildephotos/pic7thumb1.jpg);}
a.slidei {background:url(Hildephotos/pic8thumb1.jpg);}
a.slidej {background:url(Hildephotos/pic9thumb1.jpg);}
a.gallery em, a.gallery span {display:none;}
a.gallery:hover {border:1px solid #fff;}
/* styling for LEFT gallery */
#container_left {position:relative; width:600px; height:305px; background:#d1c8c3; border:1px solid #a49188; margin:1em auto;}
#container_left img {border:0;}
#container_left .thumbs {width:170px; position:absolute; left:0; top:0;}
#container_left a.gallery:hover span {display:block; position:absolute; width:402px; height:50px; top:265px; left:175px; padding:5px; font-style:italic; color:#fff; z-index:100;}
#container_left a.gallery:hover span:first-line {font-style:normal; font-weight:bold; font-size:1.1em; color:#000;}
#container_left a.gallery:active, #container_left a.gallery:focus {border:1px solid #000;}
#container_left a.gallery:active em, #container_left a.gallery:focus em {display:block; position:absolute; width:402px; height:250px; top:5px; left:180px; padding:5px; color:#000; border:1px solid #3d330f; z-index:50;}
#container_left h1 {clear:both; margin:0; padding-top:80px; padding-left:250px; width:300px; text-align:center; font-family: georgia, "times new roman", serif; font-size:3em; font-weight:normal; color:#fff;}
#container_left h1 em {font-size:0.6em; color:#000;}
</style>
</head>
<body>
<div id="container_left">
<div class="thumbs">
<a class="gallery slidea" href="#nogo"><em><img src="Hildephotos/pic10.jpg" alt="LSE Square" title="LSE Square" /></em><span>Tower of London<br />Fly handbag</span></a>
<a class="gallery slideb" href="#nogo"><em><img src="Hildephotos/pic11.jpg" alt="Buckingham Palace" title="Buckingham Palace" /></em><span>Tower of London<br />Fly handbag</span></a>
<a class="gallery slidec" href="#nogo"><em><img src="Hildephotos/pic2.jpg" alt="Tower Bridge" title="Tower Bridge" /></em><span>Tower Bridge<br />Whales handbag</span></a>
<a class="gallery slided" href="#nogo"><em><img src="Hildephotos/pic3.jpg" alt="Tower of London" title="Tower of London" /></em><span>Tower of London<br />Fly handbag</span></a>
<a class="gallery slidee" href="#nogo"><em><img src="Hildephotos/pic4.jpg" alt="Houses of Parliament" title="Houses of Parliament" /></em><span>Houses of Parliament<br />Photographs courtesy of stock.xchng</span></a>
<a class="gallery slidef" href="#nogo"><em><img src="Hildephotos/pic5.jpg" alt="St. Paul's Cathedral" title="St. Paul's Cathedral" /></em><span>St. Paul's Cathedral<br />Photographs courtesy of stock.xchng</span></a>
<a class="gallery slideg" href="#nogo"><em><img src="Hildephotos/pic6.jpg" alt="The London Eye" title="The London Eye" /></em><span>The London Eye<br />Photographs courtesy of stock.xchng</span></a>
<a class="gallery slideh" href="#nogo"><em><img src="Hildephotos/pic7.jpg" alt="Albert Hall" title="Albert Hall" /></em><span>Albert Hall<br />Photographs courtesy of stock.xchng</span></a>
<a class="gallery slidei" href="#nogo"><em><img src="Hildephotos/pic8.jpg" alt="Wandsworth Common" title="Wandsworth Common" /></em><span>Wandsworth Common<br />Photographs courtesy of stock.xchng</span></a>
<a class="gallery slidej" href="#nogo"><em><img src="Hildephotos/pic9.jpg" alt="London Taxi Cab" title="London Taxi Cab" /></em><span>London Taxi Cab<br />Photographs courtesy of stock.xchng</span></a>
</div>
<h1>Collections<br />
<em>of</em><br />
Handbags</h1>
</div>
</body>
</html>
Replies
Replied 15 Jun 2007 09:58:16
15 Jun 2007 09:58:16 Alan C replied:
I've not picked the code apart, but I use dw8 and find that often it doesn't render the pages in the same way as browsers, I just have to test in different browsers to make sure things are right. The situation is more confused when you throw in some php, if you look at the way dw writes its code and keep to that style with as little in the 'php brackets' as possible it helps.