Solved

span with style won't work with css from external file

Posted on 2016-10-16
7
23 Views
Last Modified: 2016-10-16
This is working but I don't want to use it like this because I still want to add some padding and other styles.

 <td><span style="background-color:red">Not confirmed</span></td>

Open in new window


I tried this in my .css file:

.unconfirmed{
	background-color: red;	
}

Open in new window


and then tried:

 <td><span style="unconfirmed">Not confirmed</span></td>

Open in new window


But this doesn't seem to work. What am I doing wrong?
0
Comment
Question by:Black Sulfur
  • 4
  • 3
7 Comments
 
LVL 32

Accepted Solution

by:
ste5an earned 500 total points
ID: 41845590
.name in CSS means that you need to mark your element with the corresponding class attribute.

<!DOCTYPE html>
<html>
    <head>
        <style>
            .unconfirmed { background-color: red; }
        </style>
    </head>
    <body>
        <span class="unconfirmed">Not confirmed</span>
    </body>
</html>

Open in new window

0
 

Author Comment

by:Black Sulfur
ID: 41845596
Ah, yes. Of course.

I changed it but it still doesn't work?
0
 
LVL 32

Expert Comment

by:ste5an
ID: 41845609
Please post a concise and complete example. Otherwise check whether you have correctly referenced your CSS file. Also look for typos.
0
Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

 

Author Comment

by:Black Sulfur
ID: 41845663
There is a lot of php code in my table so I don't want to confuse things by putting it all here. Would it help if I said that the table was a bootstrap one?

 <div class="content table-responsive table-full-width">
                                <table class="table table-hover table-striped">
                                    <thead>
                                    	<th>Status</th>

                                    </thead>
                                    <tbody>
 <td><span class="unconfirmed"><?php echo $status; ?></span></td>
    </tbody>
                                </table>

                            </div>

Open in new window

0
 

Author Comment

by:Black Sulfur
ID: 41845676
And yes, I have correctly referenced my css file.
0
 
LVL 32

Expert Comment

by:ste5an
ID: 41845681
There is a lot of php code in my table [..]
Thus you should make a concise sample. Craft one showing your problem. Otherwise I need to consider the question answered. Cause the root error was the wrong attribute.

And as you said there are lots of lines of code: There is a second problem somewhere, but it is impossible to guess where. It's like search for the needle in the haystack, but you cannot see or touch the haystack.

And last but not least: format your code.. this helps also to spot errors.
0
 

Author Comment

by:Black Sulfur
ID: 41845684
okay, so I a link href to the css file which is correct. But I noticed that there is a comment at the top that says (I am using a theme by the way):

<!--  CSS for Demo Purpose, don't include it in your project     -->

Open in new window


I don't understand why the css I put in there isn't working as other css that came with the theme is working.

Anyway, I created my own css file and it works just fine. Very odd.

Thanks for your help. I will close the question now.
0

Featured Post

6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Change properties of a dialog box 1 19
Re-position sub-options beneath the TAB 7 41
CSS measurement 10 14
Adjust the position 3 12
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…

757 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now