Member Avatar for snefmoo

iv just got a new computer at work and have transferred a web site over to the new computer. when i open it in dreamweaver the css styles are shown but when i go into live view or load it in a browser the css disappears. the layout is still the same but all of the divs are not in the right positions.
iv tried to re attach the style sheet but it doesnt work. does anyone have any ideas how to remedy this?

  • 4 Contributors
  • 7 Replies
  • 122 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Member #120589

Dani AI

Generated

This kind of problem almost always comes down to how the browser is resolving the stylesheet (and any referenced images) on the new machine, or to a stylesheet parse error that stops later rules from applying. has given useful clues in the head and CSS examples; noted alternate attach methods and flagged path/site-root and Dreamweaver Live View differences — those directions are the right places to investigate first.

Try these checks in order (quick and reliable):

  • Use a real browser's developer tools (F12). In the Network tab reload the page and look for the stylesheet request (status, content-type) and any 404s or console errors. In the Elements/Styles panel inspect the computed styles for an element to see whether rules from the stylesheet are present or overridden.
  • Open the stylesheet URL directly in the browser address bar to confirm the path resolves and the file is what you expect. If it doesn't load, the issue is path/site-root related.
  • Verify Dreamweaver's site definition/local root. If absolute-root paths are used, previewing with file:// will break them; preview from a local web server or switch to relative paths that match the folder layout.
  • Check for anything that would change URL resolution (a <base> tag in the page) and for spaces/percent-encoded names in folders or images — rename to simple hyphenated names if possible.
  • Clear browser cache and disable extensions that might block local resources. If the CSS is served, confirm the server sends the correct MIME type.

If the stylesheet loads but layout is still wrong: a CSS parse error early in the file can stop later rules, or specificity/doctype/box-model differences can make layouts differ between Dreamweaver and browsers. Isolate by creating a tiny test page with one rule, validate the CSS, and reintroduce rules until the failure appears. This approach quickly reveals whether the problem is path-serving or CSS parsing/engine behavior.

Recommended Answers

All 7 Replies

Member Avatar for Lusiphur

In Dreamwever specifically you get 2 options in regards to attaching your style sheet... I find, however, that only one of them works reliably. The two options are

<link href="test.css" rel="stylesheet" type="text/css" />

And...

<style type="text/css">
<!--
@import url("test.css");
-->
</style>

Between these two I almost exclusively use the import method as the link method has a habit of not registering on some (read: many) browsers.

Hope this helps :) Please mark as solved if your issue is resolved.

Member Avatar for Member #120589

have a look at your references - are they absolute or relative? Do they still apply to the new site? Are you using something like http://localhost/index.htm? Or have you got subfolders, etc? Have you tried opening the index.htm page through windows explorer? If that doesn't work, it seems that you have not referenced properly.

Member Avatar for it200219

Could you share the website URL with us ?

Member Avatar for snefmoo

the web site isnt live yet, its still in the design process and the client doesnt want us to publish it at all yet. iv checked it with my old computer and it still works fine on there, fine in design view on dreamweaver (new pc) and keeps all background settings etc just not div formatting. i have not used absolute/relative as when i did that also messed things up eg, some divs would be in the right hand side of the design in dreamweaver but centred in a browser.

this is how iv been doing the css for each div

#left
{
	width: 350px;
	margin-left:  100px;
	margin-top: 20px;
	margin-bottom: 100px;	
	background: url(layout%20images/home%20text.gif);
	border: 2px solid #000000;

}

and this is where i have linked the stylesheet in the header, having tried both link and import.

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Essential Security Solutions</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="/styles.css" rel="stylesheet" type="text/css" />
<style type="text/css">


.style1 {
	color: #FFFF00;
	font-family: Arial, Helvetica, sans-serif;
}


</style>


</head>
Member Avatar for snefmoo

this is how it looks in design view
[IMG][/IMG]

this is how it looks in live view
[IMG][/IMG]

Member Avatar for Lusiphur

i have not used absolute/relative as when i did that also messed things up eg, some divs would be in the right hand side of the design in dreamweaver but centred in a browser.

I think you misunderstood ardav in relation to absolute/relative.

From what I'm reading he was talking about your URLs within the pages and asking whether the URLs were absolute (http://yourdomain.com/page.aspx) or relative (/page.aspx) as absolute URLs sometimes auto-generated by dreamweaver and other design apps can sometimes point to a local directory in your system if the URLs were generated prior to the file being saved as part of your site/project.

This could also have applied to the location of your CSS file pointer (using either method I mentioned before) causing it to find the file locally when you test on your development computer but not find the file once uploaded to a web-server.

Hope that helps :)

Member Avatar for Member #120589

Thanks Lus.

This is an absolute wrt site root - BUT only if your site root is http://localhost/ or similar. If it has an additional '/' in it, you'll be buggered.

Try taking off the '/' at the beginning of the '/styles'

<link href="/styles.css" rel="stylesheet" type="text/css" />

However, if some styling is coming from the CSS file, it seems unlikely that you references are wrong.


//LATE - JUST NOTICED

I saw you mentioned live view in DW. That may be your problem. The live view in DW does not accurately reflect a real world browser. I never use it personally. When I want a real live view, I use about 5 real browsers, refreshing each in turn. Saves a lot of hassle with css niggles

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.