Help with css?

Johnny Dioxin · February 20, 2017

Hi guys

I've run a sim-based website for a few years and I always write it in fairly simple HTML, either on my PC or in the cpanel online, so I know what I am doing and it gives me no problems.

I recently tried using css so that I wouldn't have to format every page and on my local PC it is working just fine - but when I link it in my online html pages through cpanel, it just won't work. Even though the directory trees, pages and files are all exactly the same, it just doesn't want to know.

If anyone knows what they are doing with this kind of thing and can give me a hand, I'd be very grateful. I'm stuck until I sort this out.

Cheers.

WinterH · February 20, 2017

I know, not helpful :D but here's my opinion of CSS :D :

http://imgur.com/gallery/Q3cUg29

Toxe · February 20, 2017

I suggest asking that question for example here: https://www.reddit.com/r/webdev/

Yurgon · February 20, 2017

I don't know cpanel, but I know a thing or two about HTML and CSS.

Can you provide a link so we can take a look? If it's not supposed to be public, you could PM me.

@WinterH: LOL, soooo true! :D

@Toxe: Good idea! But maybe it's just a small typo or something simple and can be easily fixed by taking a quick look. ;)

BFBunny · February 24, 2017

CSS is fairly easy even if you don't know what you're doing.

Here is the bible https://www.w3schools.com/css/

Also this - How to use a style sheet with cpanel https://hostgatorresellercoupon2013.wordpress.com/2013/02/25/how-to-load-css-style-sheet-to-cpanel/

And here is some more help related to cpanel and how you can use inline CSS. http://www.inmotionhosting.com/support/edu/website-design/using-css/using-css-website

Also pm Yurgon. A second set of eyes is never a bad thing. Could be something really 'silly' that you may have missed.

Johnny Dioxin · February 24, 2017

Thanks, but the problem isn't coding in css - that's really easy, as you say. I use the W3C site for reference, too.

It's a particular issue, where the linked css file is not being applied.

I also asked on the ISP forum and the guys there who use css gave me examples to use - which were actually no different to the code I had used anyway, and nothing has worked.

In the end, they insisted it was a path issue and tried to tell me I was typing the path to the css file incorrectly - but not only is it correct (the css file is in the same directory of the html file linking to it) but I used the very code that they had suggested - copied and pasted.

The css file is named dcsw.css and the link to it is:

within the head section. Couldn't be simpler - but it just doesn't work.

I have an exact copy of my website on my PC and on that it is working perfectly.

tbh I've had nothing but problems with the current hosting service, so I am switching to one I used a few years back (cheaper, too). If it doesn't work there, I'll agree I've done something wrong :)

EDIT: Oh, sorry, guys - I only got notification of the last post before this one and didn't realise there had been further posts before it. After the first reply, I didn't check, as it was about as useful as an ashtray on a motorbike :D

This is the html code, with personal bits edited:

<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title></title>
<style type="text/css">:root #content > #right > .dose > .dosesingle,
:root #content > #center > .dose > .dosesingle
{ display: none !important; }
</style>
<style type="text/css">:root #content > #right > .dose > .dosesingle,
:root #content > #center > .dose > .dosesingle
{ display: none !important; }
</style>
<style type="text/css">:root #content > #right > .dose > .dosesingle,
:root #content > #center > .dose > .dosesingle
{ display: none !important; }
</style>
<link rel="stylesheet" href="dcsw.css">
</head>
<body>

<p><img alt="" src="/sunsetbanner.jpg" style="width: 95%; border-width: 3px; border-style: solid;" /></p>

<p></p>

<h1>TITLE</h1>

<h2>SUBTITLE</h2>

<p> </p>

<p> </p>

<p><a href="http://www.c9114110.myzen.co.uk/index.htm">HOME</a></p>
</body>
</html>

and this is the css file:

H1 {
font-family: Arial;
font-size: 48pt;
color: green;
text-align: center
}

H2 {
font-family: Arial;
font-size: 28pt;
text-align: center
}

BODY {
font-family: Arial;
font-size: 22pt;
text align: justify
}

A:link {
font-family: Arial;
font-size: 20pt
}

Cheers

Just one point - the whole of the top section down to the end of the header div is written by cpanel when I make a new file. Maybe that's the answer - because the ones on my PC are written entirely by me. I'll give it a go.

Edited February 24, 2017 by Brixmis

Johnny Dioxin · February 24, 2017

No, that didn't work. I even tested it with this simple html file:

<html>
<head>
<link rel="stylesheet" href="dcsw.css">

</head>

<body>
<h1>This is h1</h1>
<h2>This is h2</h2>
<a href="url">link text</a>
</body>
</html>

again, works fine on my PC test, won't work on my website :helpsmilie:

Chump · February 24, 2017

Ensure that dcsw.css is in the root directory of the site. The default type attribute value for rel=stylesheet is text/css, so I wouldn't think that you'd need to add that. No ending tag or self-closing forward slash required. I don't see anything wrong with your HTML at first glance.

Is this the page that it is supposed to be on? http://www.c9114110.myzen.co.uk/sim/dcsw/dcsw.htm If so, I do not see the link tag in the markup head section. If not, could you please provide a URL?

Johnny Dioxin · February 24, 2017

The page isn't currently public as the details have not been added.

The HTML code from it is in post #6 and the dcsw.css file is in the same directory as the HTML file.

I originally had the dcsw.css file in the directory of the page you have linked to, which is my dcsw index page, but when it didn't work, I copied it to the directory I was linking from, so that I could be sure there was no path issue (previously linked as "../dcsw.css"). That directory is under dcsw. I had tried to link it from the dcsw index.htm page first, but that page has a lot of other stuff in it, so I decided to try and get the css file working with a pretty much empty page first, then apply what I learned from it. I removed the link, for now.

So I have public_html/sim/dcsw and then separate directories for each module - and each will have a link to the dcsw.css file, if I can get it to work. The basic code for each module's HTML file will be the same as in post #6 until the detail is added.

Hope you understand what I'm waffling on about :)

This is the dcsw directory:

and this is the directory I am using to test and try to get the css file applied (it's the Viggen folder in the image above):

Yurgon · February 25, 2017

I don't see anything wrong here, sounds like it should indeed work.

But there could be a myriad of server settings that prevent the CSS file from being sent to the browser. Since you already checked that it works okay on your local machine, we'll have to take a loot at a live example.

My guess is that maybe the CSS file's access group and/or access rights are wrong (edit: nope, permissions look fine, didn't check the screenshot before I hit send), or maybe a rewrite rule tries to send the request elsewhere, or maybe CSS files are completely blocked.

We can't look into the server from the outside, but with a live example, we could tell you if it should work, so if you can set this up in some sub directory and share the link with us, we should be able to give some more pointers. :)

On a side note, and probably not related to the problem itself, but you said that top section of the HTML header was generated by cpanel? Man, that's pure uglyness, having all of these <script></script> tags when a single one would have done the job. And the selectors look, well, not wrong as such, but pretty verbose. I guess they offer the highest possible specificness (is that even a word?), but it's hard to tell what that's supposed to achieve anyway, seeing as the selected elements don't even exist in the body. I kinda always get suspicious when webhosting services do funny stuff of this type. :music_whistling:

Buzzles · February 25, 2017

Have you tried doing a ctrl-f5?

I only ask, because when I navigate to http://www.c9114110.myzen.co.uk/sim/dcsw/viggen/viggen.htm it works fine.

I can clearly see the <link> tags when inspecting AND the actual dcsw.css file being pulled down in the network requests.

Edit:

Tada!

(Ignore the fact the 200 is white rather than green. It's the second time I navigated so it was cached. It was green and freshly transferred first time around)

Edited February 25, 2017 by Buzzles

Johnny Dioxin · February 25, 2017

Wow! That's great. Thanks :)

The weird thing, though - and while not a showstopper, certainly a pain for now, is that when I attempt to edit the html file in cpanel, it still comes up with no formatting at all.

Weirdness!

On a side note, and probably not related to the problem itself, but you said that top section of the HTML header was generated by cpanel? Man, that's pure uglyness, having all of these <script></script> tags when a single one would have done the job. And the selectors look, well, not wrong as such, but pretty verbose. I guess they offer the highest possible specificness (is that even a word?), but it's hard to tell what that's supposed to achieve anyway, seeing as the selected elements don't even exist in the body. I kinda always get suspicious when webhosting services do funny stuff of this type.

Thanks for your input, everyone!

My thoughts exactly :huh:

As I said, I'll be switching hosts - but when I last used the host I'm moving to, they used cpanel as well, though they may have it set up differently.

I do have Dreamweaver but I prefer to edit my pages on site, rather than on the PC then uploading, due to this sort of problem cropping up and then having to start from square one in trying to find where the problem lies.

I prefer to edit a bit, then check it 'live', then a bit more and check and so on.

Edit: I may be a bit of a duffer here, but Ctrl-F5? Have to have a look (I'll probably kick myself) - I use simply F5 to update pages and so far it has worked just fine. In fact - I just found this discussion - so clear, really:

http://stackoverflow.com/questions/385367/what-requests-do-browsers-f5-and-ctrl-f5-refreshes-generate

F5 usually updates the page only if it is modified. The browser usually tries to use all types of cache as much as possible and adds an "If-modified-since" header to the request. Opera differs by sending a "Cache-Control: no-cache".
CTRL-F5 is used to force an update, disregarding any cache. IE7 adds an "Cache-Control: no-cache", as does FF, which also adds "Pragma: no-cache". Chrome does a normal "If-modified-since" and Opera ignores the key.
If I remember correctly it was Netscape which was the first browser to add support for cache-control by adding "Pragma: No-cache" when you pressed CTRL-F5.

Thanks for your input, everyone! :thumbup:

Edited February 25, 2017 by Brixmis

Sign In

Help with css?

Recommended Posts

Johnny Dioxin

Link to comment

Share on other sites

WinterH

Link to comment

Share on other sites

Toxe

Link to comment

Share on other sites

Yurgon

Link to comment

Share on other sites

BFBunny

Link to comment

Share on other sites

Johnny Dioxin

Link to comment

Share on other sites

Johnny Dioxin

Link to comment

Share on other sites

Chump

Link to comment

Share on other sites

Johnny Dioxin

Link to comment

Share on other sites

Yurgon

Link to comment

Share on other sites

Buzzles

Link to comment

Share on other sites

Johnny Dioxin

Link to comment

Share on other sites

Recently Browsing 0 members