Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 2 years ago.
Improve this question
Why can I not change the color, size or anything by using the project class or project id?? I can only can change something through These CLASS??
.These {
display: flex;
flex-direction: column;
height: 90vh;
align-items: center;
width: 100%;
}
#project {
color: yellow;
font-size: 3rem;
}
<div class="These">
<p clsss="project" id="project">
These are some of my projects
</p>
</div>
Check and make sure your CSS style sheet is properly linked to your HTML.
Your code works for me in codepen.There is a typo, however the ID should still pull it so I would check for a linking issue or post your
There is a typo in your paragraph element. Change clsss to class.
You have missspelled class. You have use clsss instead of class.
Snippet:
<div class="These">
<p class="project" id="project">
These are some of my projects
</p>
</div>
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed last year.
Improve this question
This is an example of what my problem is. When I type for example the
section on html then go to CSS to style it, it does work fine, but
then when I add another style in the CSS file it doesn't seem to work
and only styles the first part so in this case the .header img and the
h1 part doesn't get styled at all. When I put the h1 part in front of
the .header only h1 gets styled and not the .header img. Inline CSS
works but its very inconvenient to use. This happens even when I try
using the inside the html document. I have tried it on
other text editors and it's the same problem. When I try someone
else's code it works fine, it's only when I do it on a project that
does this.
.header {
min-height: 100vh;
width: 100%;
background-position: center;
background-size: cover;
position: relative;
}
;
h1 {
color: aqua;
}
;
<section class="header">
<img src="/download.png">
</section>
<h1>asdad</h1>
Syntax of your css code is wrong. There cannot be semicolons outside .class{}
You should remove semicolons before and after your h1{} style.
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 1 year ago.
Improve this question
I have an HTML section that I am trying to alter with CSS:
<section class="jumbo">
<div class="container">
<h1>THIS IS THE TEXT CONTAINED WITHIN THE JUMBO</h1>
</div>
</section>
However the changes I make in my CSS file, such as changing the color of the text contained in the element are not having any affect:
#jumbo {
background-image: url("../images/carbon.jpeg");
background-position: center center;
min-height: 200px;
text-align: center;
}
#jumbo h1 {
color: white;
font-size: 45px;
padding-top: 15px;
line-height: 1.6em;
}
Do you have any tips for how I can debug an issue like this?
You have to use .jumbo.
More about CSS selectors: https://www.w3schools.com/cssref/css_selectors.asp
#jumbo is an id selector
you should use a class selector
.jumbo and .jumbo h1
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 1 year ago.
Improve this question
I want to target everything in the body except 2 classes
body {
background: gray;
}
What I am try:
body:not(.myCustomClassWhereIsBackgroundWhite) {
background: white;
}
My angular component Profile:
<div class="myCustomClassWhereIsBackgroundWhite">
...other context
</div>
In this component is not affected background: white;
This is no work ?
Please provide me some solution ?
I want to some class to change and not be background gray
body:not(.myCustomClassWhereIsBackgroundWhite) targets body elements which donot have class myCustomClassWhereIsBackgroundWhite.
Reference
If you want to look elements inside body, you have to add a space like.
body :not(.myCustomClassWhereIsBackgroundWhite)
body {
background: gray;
}
body :not(.myCustomClassWhereIsBackgroundWhite) {
background: white;
}
<div class="myCustomClassWhereIsBackgroundWhite">
...other context
</div>
<div>
Some other element
</div>
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 5 years ago.
Improve this question
Please look at following html...
.wrapper {
position: relative;
}
.mydiv1 {
margin-left: -10px;
margin-top: -10px;
}
<div class="wrapper">
<div class="mydiv1">div1</div>
</div>
.mydiv1 was pulled left as 10px and through out it's parent's left border.
But nothing happens on its top.
Why did it work differently?
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 7 years ago.
Improve this question
Hi there I was wondering how I would make an image appear when I hover over another one.
I have some code but it just isn't working I think it should be something like this;
CSS-
a bikeq
{
display: none;
}
a:hover bikeq {
display: block;
}
HTML-
<section class="r_img">
<img src="img/bike.png" class="bike">
<img src="bikeq_3.png" class="bikeq">
</section>
I fell like I am doing something wrong with the html part but I don't know what else to do.
Any help will be great thanks,
Zack
Keeping the HTML you have provided is not possible, as the elements are sibling. You can "fake" this effect with the following code:
<section class="r_img">
<img src="img/bike.png" class="bike">
<img src="bikeq_3.png" class="bikeq">
</section>
.bikeq {
display: none;
}
.r_img:hover .bikeq
{
display: block;
}
When hovering the container of the two images, the image with .bikeq class will show up..
Try this:
html
<section class="r_img">
<a href="" class=”bike_img”></a>
</section>
css
a.bike_img { width: ?px; height: ?px; display: inline-block; background: url("img/bike.png"); }
a.bike_img:hover { background: url("img/bikeq_3.png"); }
Where ?px are the width and height of your image. You will also need to make sure that your image urls are corrrect, I just had a guess.