Participant

Question

My html doc doesn't seem to be reading my css

9 replies
558 views
Translate

I've built a simple website and am using css. My css file seems to be imported correctly, but the text isn't responding to it. I've done this a few times in the past with no problems, but it's been few years. Am I doing something wrong? Would be happy to post the page and share a link if anyone is willing to help. Thanks.

This topic is closed to new replies. Start a new post to keep the conversation going.

Nancy OShea

Community Expert

Did you define your local site folder BEFORE you started this project by going to Site > New site and selecting a folder on your primary hard drive -- not a networked or cloud drive? For example, C:\myTestSite\

And does the stylesheet reside in your local site?

Translate

Nancy O'Shea— Product User & Community Expert

D

defaultqa2ez3ivhmtlAuthor

Participant

Yes, I began with a folder on my hard drive called "client". I defined that folder as my local site. Everything related to the site, including the .css, is located in that folder at the root level.

Translate

B

Ben M

Community Expert

Best thing to do is to post a link to your page so it can be viewed online. In many cases this can be caused by conflicting CSS or an issue in the code which is causing rules not to respond.

Translate

D

defaultqa2ez3ivhmtlAuthor

Participant

Thanks, Ben.

https://www.lecompliance.com/v3/index.html

Translate

O

osgood_

Legend

css classes need to start with a period - .

So in your css stylesheet you have the below:

body_2

instead of: (period before the selector (see in red below)

.body_2

Don't get confused and add a period before the genuine 'body' tag which exists as a default html selector. Infact you should name your paragraphs something which leads to less confusion, like 'body_text' or 'main_text'

Not sure what it is you are trying to do BUT the use of tables and images to construct a website kind of went out of business about 15 years ago............now you need to consider mobile devices so your website is responsive.

Translate

Nancy OShea

Community Expert

Copy & paste this code into a new document & save to your local site folder as test.html.

Can you see the CSS styles in Live view as opposed to Design view? Toggle views with Ctrl + Shift + F11.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CSS Test</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.fluid {max-width:100%}
.thumb {padding:12px; box-shadow: 5px 6px 1px rgba(0,0,0,0.3)}
h3 {color:antiquewhite; background:brown; padding:1%}
</style>
</head>
<body>
<div>
<h3>Heading 3</h3>
<a href="https://example.com">
<img src="https://dummyimage.com/400x300" class="fluid thumb " alt="Placeholder" title="Example.com">
</a>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Perspiciatis velit minima hic tenetur ea nesciunt tempore voluptas, architecto obcaecati, iusto optio quidem explicabo odit expedita quas? Aliquam libero numquam nesciunt!</p>
</div>
</body>
</html>

Translate

Nancy O'Shea— Product User & Community Expert

D

defaultqa2ez3ivhmtlAuthor

Participant

Yes, thank you, Nancy - Live view shows me the grey box with 400x300 in it, Design view shows me a broken link.

Translate

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.