Hi, I have a couple of questions. Does anyone happen to know why my homepage looks different in Dreamweaver when I preview in browser then it does when I upload the page onto the server? http://www.iewaterkeeper.org/ I see a join our mailing list button is intact when I preview in browser but is no where to be found when I view the uploaded page from the server. Other weird things have been going on with Dreamweaver today like I wasn't able to absolute position a div tag in it's intended place and all the typography on my homepage looks very blurry in Dreamweaver but looks clearer when it's uploaded to the server. Does anyone know what's going on? Any help would be greatly appreciated. .... Could it be a virus?
I tried to fill in the background color for that div tag but the color is different from the other grey areas even though it's the same 6 digit hex
What hex code did you use? Can't see anything added. I suggest use color: #EEEEEE to match the rest of the colors on the page.
The other thing is that there's a line next to the Waterkeeper on Facebook sign and I'm also not sure how to fill in that gap either.
It is an image as far as I can see: The image is this:
<http://www.iewaterkeeper.org/_images/facebooktop.gif>
If this not so then point exactly what do you mean by " line next to the waterkeeper facebook sign"
What hex code did you use? Can't see anything added. I suggest use color: #EEEEEE to match the rest of the colors on the page.
I used #F4F3F3 because that's what I got with the color picker in the CSS Panel for that div. I don't think it's working properly. Am I doing it wrong?
what do you mean by " line next to the waterkeeper facebook sign"
There's a thin vertical line next to the image that doesn't belong there. I have no idea what it is. I added the width up and they come out right so I don't know where that gap is coming from.
Someone from my laptop company remote accessed my laptop and he didn't think it was a virus. Can someone please help? http://www.iewaterkeeper.org/ Does anyone know why Dreamweaver is acting weird? The "join our mailing list" button that I see when I preview browser is there but it's nowhere to be found in any of the browsers. The "like us on Facebook" button is supposed to be right above the "join our mailing list" button which is underneath the sign that says "Waterkeeper on Facebook" (if you look at the code, you'll notice that it is suppposed to be there) but it's all the way at the top of the header. Again, earlier, I had a hard time absolute positioning a div tag called "facebookmailinglist" which was supposed to be below facebooktop, it kept positioning itself at the top of the page even though the code said top "565px" or something like that. I had read the CSS panel code several times and all seemed correct. Does anyone have any ideas why Dreamweaver is acting bonkers?
Hi, Here's the source code from the site, I checked the validator.w3.org. I don't know if I'm reading this right but is this
telling me that the closing body tag didn't have a closing arrow button: > ? If so, I checked the code in Dreamweaver and it's there, it is also in the body tag on the page source in the source code. Am I reading this right? Should I post the original code that is in Dreamweaver:
That's so weird because I'm looking at the code in Dreamweaver and line 181 has a closing </body>. Here's the code straight from Dreamweaver:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Inland Empire Waterkeeper</title>
<link href="_css/styles.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body,td,th {
color: #999999;
font-family: Verdana, Geneva, sans-serif;
}
body {
background-color: #FFFFFF;
color: #D6D6D6;
background-image: url(_images/background_1255hompage.png);
background-repeat: repeat-x;
margin: auto;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
</style>
</head>
<body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="container">
<div class="header"><img src="_images/banner1.jpg" alt="Inland Empire Waterkeeper" width="933" height="300" /></div>
<div class="menubar">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="index.html" class="MenuBarItemSubmenu">Home</a>
<ul>
<li><a href="mission.html" class="MenuBarItemSubmenu">About Us</a>
<ul>
<li><a href="mission.html">Our Mission</a></li>
<li><a href="history.html">Our History</a></li>
<li><a href="community.html">Our Community</a></li>
</ul>
</li>
<li><a href="staff.html" class="MenuBarItemSubmenu">Our Team</a>
<ul>
<li><a href="staff.html">Staff</a></li>
<li><a href="supporters.html">Supporters</a></li>
<li><a href="advisoryboard.html">Advisory Board</a></li>
</ul>
</li>
<li><a href="coastkeeper.html">Coastkeeper</a></li>
</ul>
</li>
<li><a href="projects.html" class="MenuBarItemSubmenu">What We Do</a>
<ul>
<li><a href="advocacy.html" class="MenuBarItemSubmenu">Programs</a>
<ul>
<li><a href="advocacy.html">Advocacy</a></li>
<li><a href="education.html">Education</a></li>
<li><a href="research.html">Research</a></li>
<li><a href="restoration.html">Restoration</a></li>
<li><a href="enforcement.html">Enforcement</a></li>
</ul>
</li>
<li><a href="projects.html">Projects</a></li>
<li><a href="datareports.html">Data & Reports</a></li>
</ul>
</li>
<li><a href="volunteer.html" class="MenuBarItemSubmenu">Get Involved</a>
<ul>
<li><a href="volunteer.html">Volunteer</a></li>
<li><a href="employment.html">Employment</a></li>
<li><a href="events.html">Events & Meetings</a></li>
<li><a href="donate.html">Donate</a></li>
</ul>
</li>
<li><a href="pressreleases.html" class="MenuBarItemSubmenu">News Room</a>
<ul>
<li><a href="pressrelease.html">In the News and Press Releases</a></li>
<li><a href="legislation.html">Legislative Updates</a></li>
<li><a href="waternews.html">Water in the News</a></li>
</ul>
</li>
<li><a href="reportpollution.html" class="MenuBarItemSubmenu">Resources</a>
<ul>
<li><a href="watershed.html" class="MenuBarItemSubmenu">Information</a>
<ul>
<li><a href="watershed.html">Our Watershed</a></li>
<li><a href="reportpollution.html">Report Pollution</a></li>
</ul>
</li>
<li><a href="photos.html">Photo Gallery</a></li>
</ul>
</li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div>
<div class="missionstatement"><img src="_images/mssionstatement.gif" alt="Inland Empire Waterkeeper" width="933" height="110" /></div>
<div class="space1"><img src="_images/bar_left.png" alt="Inland Empire Waterkeeper" width="20" height="315" /></div>
<div class="facebook">
<div class="facebooktop">
<img src="_images/facebooktop.gif" width="106" height="125" alt="Inland Empire Waterkeeper" /></div>
<div class="facebookmailinglist">
<div class="fb-like" data-href="http://www.iewaterkeeper.org/" data-send="true" data-width="106" data-show-faces="false"></div>
<!-- BEGIN: Constant Contact Standard Email List Button -->
<div align="center">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tl_gray.gif" width="6" height="6" alt=""></td>
<td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_top_gray .gif"> </td>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tr_gray.gif" width="6" height="6" alt=""></td>
</tr>
<tr>
<td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_left_gra y.gif"></td>
<td bgcolor="#cccccc"><a href="http://visitor.r20.constantcontact.com/d.jsp?llr=wejp69bab&p=oi&m=1101 488694422" target="_blank" style="text-decoration:none; font-weight: bold; font-family:Arial; font-size:10px; color:#336666;">Join Our Email List</a></td>
<td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_right_gr ay.gif"></td>
</tr>
<tr>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bl_gray.gif" width="6" height="6" alt=""></td>
<td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_bottom_g ray.gif"> </td>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_br_gray.gif" width="6" height="6" alt=""></td>
</tr>
</table>
</div>
<!-- END: Constant Contact Standard Email List Button -->
</div>
<div class="space2"><img src="_images/bar_right.png" width="21" height="315" alt="Inland Empire Waterkeeper" /></div>
<div class="video"><iframe width="560" height="315" src="http://www.youtube.com/embed/3OU8D8kBjWg" frameborder="0" allowfullscreen></iframe></div>
<div class="space3"></div>
<div class="photospace1"></div>
<div class="photo1"><a href="_images/kayaking_6lg.png"><img src="_images/kayaking_6.jpg" alt="Inland Empire Waterkeeper" width="176" height="95" /></a></div>
<div class="photospace2"></div>
<div class="photo2"><a href="_images/riverkat_57lg.png"><img src="_images/riverkat_57.jpg" width="176" height="95" alt="Inland Empire Waterkeeper" /></a></div>
<div class="photospace3"></div>
<div class="photo3"><a href="_images/riverkat_172lg.png"><img src="_images/riverkat_172.jpg" width="176" height="95" alt="Inland Empire Waterkeeper" /></a></div>
<div class="photospace4"></div>
<div class="space4"></div>
<div class="pillars"><img src="_images/pillars_grey.jpg" alt="Inland Empire Waterkeeper Pillars" width="933" height="400" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="77,54,297,198" href="advocacy.html" alt="Inland Empire Waterkeeper Advocacy" />
<area shape="rect" coords="361,51,584,195" href="education.html" alt="Inland Empire Waterkeeper Education" />
<area shape="rect" coords="636,54,858,196" href="research.html" alt="Inland Empire Waterkeeper Research" />
<area shape="rect" coords="212,220,430,352" href="restoration.html" alt="Inland Empire Waterkeeper Restoration" />
<area shape="rect" coords="502,222,726,364" href="enforcement.html" alt="Inland Empire Waterkeeper Enforcement" />
</map>
</div>
<div class="footer"><img src="_images/footer2.png" width="933" height="100" alt="Inland Empire Waterkeeper" /></div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
You don't have a class called 'facebookmailinglist' in your css file its called 'mailinglist'
So you need to amend this:
<div class="facebookmailinglist">
to this:
<div class="mailinglist">
Thanks! That makes sense. I changed the name of the class through the CSS Styles panel I guess it didn't update? Anyway, I'll just redo it. Thanks!
Can someone go through this with me? I don't know what is the next most important thing to fix. I'm a designer not a programmer. I got the "like us on facebook" button and the "join our email list" button to go where it belongs. Yay! But will need some more help fixing errors. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.iewaterkeeper.org%2 F&charset=%28detect+automatically%29&doctype=Inline&group=0&user-agent =W3C_Validator%2F1.3 I'll take any help out there. Thanks.
Sorry, one more thing, does anyone happen to know how to get the background color of the div tag to change? I used the background color's color picker to maintain the same color on the page but the box color doesn't match.
Also does anyone happen to know how to get the "like us on facebook" and "join our mailing list" to sit at the top of the div? Thanks.
Make a backup of your original page. Then try this HTML -
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Inland Empire Waterkeeper</title>
<link href="_css/styles.css" rel="stylesheet" type="text/css">
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<style type="text/css">
body,td,th {
color: #999999;
font-family: Verdana, Geneva, sans-serif;
}
body {
background-color: #FFFFFF;
color: #D6D6D6;
background-image: url(_images/background_1255hompage.png);
background-repeat: repeat-x;
margin: auto;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
</style>
</head>
<body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="container">
<div class="header"><img src="_images/banner1.jpg" alt="Inland Empire Waterkeeper" width="933" height="300"></div>
<div class="menubar">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="index.html" class="MenuBarItemSubmenu">Home</a>
<ul>
<li><a href="mission.html" class="MenuBarItemSubmenu">About Us</a>
<ul>
<li><a href="mission.html">Our Mission</a></li>
<li><a href="history.html">Our History</a></li>
<li><a href="community.html">Our Community</a></li>
</ul>
</li>
<li><a href="staff.html" class="MenuBarItemSubmenu">Our Team</a>
<ul>
<li><a href="staff.html">Staff</a></li>
<li><a href="supporters.html">Supporters</a></li>
<li><a href="advisoryboard.html">Advisory Board</a></li>
</ul>
</li>
<li><a href="coastkeeper.html">Coastkeeper</a></li>
</ul>
</li>
<li><a href="projects.html" class="MenuBarItemSubmenu">What We Do</a>
<ul>
<li><a href="advocacy.html" class="MenuBarItemSubmenu">Programs</a>
<ul>
<li><a href="advocacy.html">Advocacy</a></li>
<li><a href="education.html">Education</a></li>
<li><a href="research.html">Research</a></li>
<li><a href="restoration.html">Restoration</a></li>
<li><a href="enforcement.html">Enforcement</a></li>
</ul>
</li>
<li><a href="projects.html">Projects</a></li>
<li><a href="datareports.html">Data & Reports</a></li>
</ul>
</li>
<li><a href="volunteer.html" class="MenuBarItemSubmenu">Get Involved</a>
<ul>
<li><a href="volunteer.html">Volunteer</a></li>
<li><a href="employment.html">Employment</a></li>
<li><a href="events.html">Events & Meetings</a></li>
<li><a href="donate.html">Donate</a></li>
</ul>
</li>
<li><a href="pressreleases.html" class="MenuBarItemSubmenu">News Room</a>
<ul>
<li><a href="pressrelease.html">In the News and Press Releases</a></li>
<li><a href="legislation.html">Legislative Updates</a></li>
<li><a href="waternews.html">Water in the News</a></li>
</ul>
</li>
<li><a href="reportpollution.html" class="MenuBarItemSubmenu">Resources</a>
<ul>
<li><a href="watershed.html" class="MenuBarItemSubmenu">Information</a>
<ul>
<li><a href="watershed.html">Our Watershed</a></li>
<li><a href="reportpollution.html">Report Pollution</a></li>
</ul>
</li>
<li><a href="photos.html">Photo Gallery</a></li>
</ul>
</li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div>
<div class="missionstatement"><img src="_images/mssionstatement.gif" alt="Inland Empire Waterkeeper" width="933" height="110"></div>
<div class="space1"><img src="_images/bar_left.png" alt="Inland Empire Waterkeeper" width="20" height="315"></div>
<div class="facebook">
<div class="facebooktop">
<img src="_images/facebooktop.gif" width="106" height="125" alt="Inland Empire Waterkeeper"></div>
<div class="facebookmailinglist">
<div class="fb-like" data-href="http://www.iewaterkeeper.org/" data-send="true" data-width="106" data-show-faces="false"></div>
<!-- BEGIN: Constant Contact Standard Email List Button -->
<div align="center">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tl_gray.gif" width="6" height="6" alt=""></td>
<td style="background-image:url(https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_top_gray .gif)"> </td>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tr_gray.gif" width="6" height="6" alt=""></td>
</tr>
<tr>
<td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_left_gra y.gif"></td>
<td bgcolor="#cccccc"><a href="http://visitor.r20.constantcontact.com/d.jsp?llr=wejp69bab&p=oi&m=1101 488694422" target="_blank" style="text-decoration:none; font-weight: bold; font-family:Arial; font-size:10px; color:#336666;">Join Our Email List</a></td>
<td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_right_gr ay.gif"></td>
</tr>
<tr>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bl_gray.gif" width="6" height="6" alt=""></td>
<td background="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_bottom_g ray.gif"> </td>
<td><img src="https://imgssl.constantcontact.com/ui/images/visitor/bevel_br_gray.gif" width="6" height="6" alt=""></td>
</tr>
</table>
</div>
<!-- END: Constant Contact Standard Email List Button -->
</div>
<div class="space2"><img src="_images/bar_right.png" width="21" height="315" alt="Inland Empire Waterkeeper"></div>
<div class="video"><iframe width="560" height="315" src="http://www.youtube.com/embed/3OU8D8kBjWg" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>
<div class="space3"></div>
<div class="photospace1"></div>
<div class="photo1"><a href="_images/kayaking_6lg.png"><img src="_images/kayaking_6.jpg" alt="Inland Empire Waterkeeper" width="176" height="95"></a></div>
<div class="photospace2"></div>
<div class="photo2"><a href="_images/riverkat_57lg.png"><img src="_images/riverkat_57.jpg" width="176" height="95" alt="Inland Empire Waterkeeper"></a></div>
<div class="photospace3"></div>
<div class="photo3"><a href="_images/riverkat_172lg.png"><img src="_images/riverkat_172.jpg" width="176" height="95" alt="Inland Empire Waterkeeper"></a></div>
<div class="photospace4"></div>
<div class="space4"></div>
<div class="pillars"><img src="_images/pillars_grey.jpg" alt="Inland Empire Waterkeeper Pillars" width="933" height="400" border="0" usemap="#Map">
<map name="Map" id="Map">
<area shape="rect" coords="77,54,297,198" href="advocacy.html" alt="Inland Empire Waterkeeper Advocacy">
<area shape="rect" coords="361,51,584,195" href="education.html" alt="Inland Empire Waterkeeper Education">
<area shape="rect" coords="636,54,858,196" href="research.html" alt="Inland Empire Waterkeeper Research">
<area shape="rect" coords="212,220,430,352" href="restoration.html" alt="Inland Empire Waterkeeper Restoration">
<area shape="rect" coords="502,222,726,364" href="enforcement.html" alt="Inland Empire Waterkeeper Enforcement">
</map>
</div>
<div class="footer"><img src="_images/footer2.png" width="933" height="100" alt="Inland Empire Waterkeeper"></div>
</div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</div>
</body>
</html>
North America
Europe, Middle East and Africa
Asia Pacific