Hi I am trying to learn dreamweaver and found a website that I want to expore how it was made. In the html of the site, it contains the CSS stylessheet for the boarders and styles of the page. I have downloaded the original CSS style sheet that was created and renamed it to training.css. When on go into the html and change the location path to where the CSS style is and go into design mode, the boarders and layout does not look the same compared to beofore I made the change. How am I able to be able to see this exactly how it is in design mode.
Without seeing the site, it's hard to comment. Depending on how the site was built, you would need to download all the supporting files to your local site folder -- CSS, HTML, Images, Scripts, Flash/SWF, etc...
not really it's just this one style sheet that contains how the boarders are, when I remove it the boarders are gone. I basically just want to be able to edit this, but in deisgn mode exactly how i see it.
Ok here is the full html, copy it in dreamweaver. then go to design mode. I want to be able to modify the borders but dreamweaver will not allow me. When I try renaming the styles sheet to something else, and targeting that source, the borders and layout is different.
<!-- OpenGraph --> <meta property="og:title" content="bubble gum, kids toys, zebras"/> <meta property="og:type" content="article"/> <meta property="og:url" content="this will have to be changed"/> <meta property="og:image" content="http://FITER.COM"/> <meta property="og:site_name" content="TreeHugger"/> <meta property="og:description" content="We 'Huggers with our aspiring clean, fiber-rich diets probably aren't as likely to experience the daily (yikes!) Irritable Bowel Syndrome (IBS) that some millions of Americans do, according to The New York Times. "/> <meta property="fb:app_id" content="133255656700169" />
<script type="text/javascript">
var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-1096487-1']); _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>
<div id="container">
<div id="header">
<div id="logo-bar">
<div id="logo"> <p>BSTING page </p> </div> </div><!-- end logo-bar -->
<p> </p> <p> </p> <p>text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed </p><p>text that can be changed ,</p><blockquote><p>text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed text that can be changed </p> </blockquote> <p> </p> </div>
<script type="text/javascript"> /* <![CDATA[ */ var s_account="hswprodthg"; /* ]]> */ </script> <script type="text/javascript" src="http://static.treehugger.com/scripts/omniture/s_code.js"></script> <script type="text/javascript"> /* <![CDATA[ */ function writeImage(method, data, action, current) { $(document.createElement("img")).attr({ id: 'hswOmniImage', src: data }).load(function () { if (method !== 'none') { clearTimeout(t); doAction(method, action, current); } }); if (typeof method === 'string' && method !== 'none') { var t = setTimeout(function () { doAction(method, action, current); }, 500); } }
function doAction(method, action, current) { if (method == 'form') { current.submit(); } else { document.location.href = action; } }
function isPurchaseEvent(tag, lookupArray) { var found = false; for (key in lookupArray) { if (tag.indexOf(lookupArray[key]) >= 0) { found = lookupArray[key]; break; } } return found; }
function inArray(tag, lookupArray) { var found = false; for (key in lookupArray) { if (tag.indexOf(lookupArray[key]) >= 0) { found = true; break; } } return found; }
function sendTags(tag, vars, current, eventObj, noRedirect) { if (tag != '') { var hswOmniImage = document.getElementById('hswOmniImage'); var omniImageData = "http://metrics.howstuffworks.com/b/ss/" + s_account + "/1/H.17/s45086097826030?"; var gotoAction = '' var tagName = ''; var timestamp = new Date(); var year = timestamp.getFullYear(); var month = timestamp.getMonth() + 1; var day = timestamp.getDate(); var hours = timestamp.getHours(); var mins = timestamp.getMinutes(); var secs = timestamp.getSeconds(); var weekday = timestamp.getDay(); var timezoneOffset = timestamp.getTimezoneOffset(); var gValue = location.protocol + '//' + location.hostname; var omniPrefix = ''; if (location.pathname) { gValue += location.pathname; } omniImageData += '&AQB=1'; omniImageData += '&t=' + month + '/' + day + '/' + year + ' ' + hours + ':' + mins + ':' + secs + ' ' + weekday + ' ' + timezoneOffset; omniImageData += '&vmt=' + '4467DB86'; omniImageData += '&ns=' + 'hswmedia'; omniImageData += '&g=' + encodeURIComponent(gValue); var subDomain = location.href; subDomain = subDomain.substring(7, subDomain.indexOf('.', 7)); if (subDomain == 'recipes') { if (vars) { vars = vars.replace(/=/gi, '=TLC : '); vars = vars.replace(/events=TLC :/gi, 'events='); vars = vars.replace(/products=TLC :/gi, 'products='); } }
I just want to be able to save this to my desktop, rename it and repalce this with where it's located on my desktop and still see the boarders and layout the same in desgn mode. If you past the full html in dreamweaver and go to design you will see how I would like it. then save the CSS and repalce with with a new name, located the file and replace it in the html and go back to design mode and you will notice that everthing is different.
You cannot edit a stylesheet on someone else's server. You must open their stylesheet.css file in your browser, copy & paste their code into your HTML document or an external stylesheet in YOUR local site folder.
Incidentally, the code on that site isn't what I call terrific. Not exactly a good learning aid for beginners. If you want to learn other people's bad habits, fine. But if you want to learn good habits, look at any of the CSS Layouts at Project Seven or use their Column Composer Magic extension for Dreamweaver.
70 posts 
