Jump to content
Please Use CODE Tags

Need help with CSS

RockiLocky
By RockiLocky
in Programming
 Share
Go to solution Solved by Ddave,

At the moment I can't think of possible reasons as to why your styles are not being applied.

What I suggest you do is Inspect the h5 element to see what style is being used.

 

See screenshot:

image.png.2ddf301269741953086380ff20a45279.png

The style highlighted with yellow is being overridden by the one underlined with red.

This might help you pinpoint what the problem is.

Posted

Hey guys,

 

I have the problem currently(I am using bootstrap too) that when I use a heading f.e. h1,h2,h3 or any other I am not able to change the color of it.

 

For information the header is under these parent tags: 

<body>
  <div class="tab-content">
    <div class="tab-pane">
      <h5>Test</h5>
    </div>
  </div>
</body>

 

I tried following steps: 

-- Tried to force the color onto the hearder, but didnt work:
<h5 style="color:white;"> </h5>

--I tired to use class from another css. Importantly when setting the link references the other css is under bootstrap so it should override its properties, but did not work either:
inside a css file:
.test{
	color:white;
}

in the html file:
<h5 class="test"><h5>
  

-Tried to make a style for it inside the body, but didnt work either:
  <body>
    <style>
    h5{
      	color: white;
      }
    </style>
  .....
  .....
  .....
  
  </body>
  
  
 -Also tried to force override the h5 settings with inside a css file:
  h5{
  color:white;
  }

 

I also tried to find out if the parent tags force any color onto it through bootstrap but neither .tab-content nor .tab.pane do changes to color(font-color) or anything. I am a little bit at a loss because I dont know a way without changing it inside the bootstrap file, to get around it rn and I dont want to change any source code for now for late porpuses of the headings.

 

 

Anybody got an idea what I can do?

 

Nice Greets,

Rocki

Link to comment
Share on other sites
Link to post
Share on other sites
Posted (edited)

Use a colon in the css style: 

color:white;

 

Edit: Move along, reading post again.

 

Edited by Ddave
No sleep, didn't read.

CPU: Intel i5-4590 | Motherboard: Asus H97M-E | GPU: Sapphire Nitro R9 390 | RAM: 2x4Gb Kingston HyperX Fury Black | SSD: Sandisk Plus 240Gb | HDD: Seagate 250Gb  | PSU: Seasonic G650 80+ Gold | Case: NZXT S340

I am who I am.

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author
Just now, Ddave said:

Use a colon in the css style: 


color:white;

 

Would you mind explaining that more in detail I just started programming in css 3days ago ;D

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

you'll need to create a "sub" class for h5. 

So in your case

 

.test h5 {

color: white;

}

 

Then you can use that class with h5

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author
4 minutes ago, Dujith said:

you'll need to create a "sub" class for h5. 

So in your case

 

.test h5 {

color: white;

}

 

Then you can use that class with h5

I came up with that already: 

.sph h5{
  color:#cfd8ef;
  font-family:serif;
  font-style:italic;
  display:inline;
}

 

Did not work for me D:

 

 

Could give you the whole source code if you want to

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
10 minutes ago, RockiLocky said:

Would you mind explaining that more in detail I just started programming in css 3days ago ;D

According to your post, this is what you used: 

.test{
	color=white;
}

The "=" should be replaced with ":" otherwise it will not work.

Anyway I did not notice that the last example in your post uses the colon.

CPU: Intel i5-4590 | Motherboard: Asus H97M-E | GPU: Sapphire Nitro R9 390 | RAM: 2x4Gb Kingston HyperX Fury Black | SSD: Sandisk Plus 240Gb | HDD: Seagate 250Gb  | PSU: Seasonic G650 80+ Gold | Case: NZXT S340

I am who I am.

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author
Just now, Ddave said:

According to your post, this is what you used: 


.test{
	color=white;
}

The "=" should be replaced with ":" otherwise it will not work.

Anyway I did not notice that the last example in your post uses the colon.

sry that is my bad for writing fast here I didnt copy and paste anything to this post just wrote up fast. Will fix it. But I did use color: white; in my source code

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Solution

At the moment I can't think of possible reasons as to why your styles are not being applied.

What I suggest you do is Inspect the h5 element to see what style is being used.

 

See screenshot:

image.png.2ddf301269741953086380ff20a45279.png

The style highlighted with yellow is being overridden by the one underlined with red.

This might help you pinpoint what the problem is.

CPU: Intel i5-4590 | Motherboard: Asus H97M-E | GPU: Sapphire Nitro R9 390 | RAM: 2x4Gb Kingston HyperX Fury Black | SSD: Sandisk Plus 240Gb | HDD: Seagate 250Gb  | PSU: Seasonic G650 80+ Gold | Case: NZXT S340

I am who I am.

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author
7 minutes ago, Ddave said:

At the moment I can't think of possible reasons as to why your styles are not being applied.

What I suggest you do is Inspect the h5 element to see what style is being used.

 

See screenshot:

image.png.2ddf301269741953086380ff20a45279.png

The style highlighted with yellow is being overridden by the one underlined with red.

This might help you pinpoint what the problem is.

Thanks will check that out now

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author
5 minutes ago, RockiLocky said:

Thanks will check that out now

Thanks man that helped me out found the little bastard.

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
2 hours ago, RockiLocky said:

Thanks man that helped me out found the little bastard.

Then tag him as best answer and not your own post ;)

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author
14 hours ago, Dujith said:

Then tag him as best answer and not your own post ;)

Seems like I am too dumb to realize the difference between a quote and his post

 

Thank you for helping out too ;D

Link to comment
Share on other sites
Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing Programming

×