Font CSS being overridden [closed] - css

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 8 years ago.
Improve this question
I am currently making a website and having trouble with font sizes. You can see a demo of what I've done at www.dweeman.com. It is happening with the phone number font size at the top right and the copyright information in the bottom left. The CSS for them both is as follows:
p.copyright {size: 0.2em;}
p.phone {size: 0.75em;}
However it seems like something else in my CSS is overriding their.
I am using third party code for my navigation. I can't see anything in the CSS that would be doing this and was looking for another eye.
You can see all this on my test website I mentioned above, but if needed I can post my stylesheet here (it is quite long).
Thanks

Quite a few issues with your site. And I really suggest reading up on how CSS selectors work. But in answer to your question.
You've set phone and copyright to have IDs. eg:
<p id="phone">
But in your CSS you've applied styles to the CLASS phone.
Change your respective P tags to:
<p class="phone"> Foo </p>

Related

What is the best way to make sure this css works in all browsers? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 8 years ago.
Improve this question
I am taking over an application that has buttons with this css:
background-image: -moz-linear-gradient(center top , #049CDB, #0064CD);
it looks beautiful in firefox but looks like a mess in IE, etc
what is the best way to take these clearly firefox specific css and determine the best way to make it look the same on all browsers (just need IE8+)
This tool might be a useful tool for you.
Since this CSS attribute is still a working draft of CSS and has some legacy it will require a lot of markup to be fully supported for your current situation. The -moz- prefix is one such isntance of providing support. All other browsers will required either the standard, -ms-, -webkit-, -webkit-type or -o- prefix as well.
You should look out for other spots in the application you've taken over for code that hasn't been fully tested on other browsers.
LINK
http://www.colorzilla.com/gradient-editor/
This is a matter of opinion but there are tools online that will help you generate css for gradients that works across browsers. http://www.colorzilla.com/gradient-editor/ is an example.

CSS on hover , layout changes [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 9 years ago.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Improve this question
I am displaying a list of orders which logged in users have placed and the status of the orders.
Data displays perfectly like :
But when I hover mouse on previous/next buttons i.e. page navigation menu then it looks something like :
That menu behaves different or not as per expectation.
I have put whole page in zip file that I have attached here on my google drive.
When I remove style1.css from it then it works fine but all page formation I have provided inside it, so anyone help me for that how to avoid css conflict.
Thank You.
This is because on line 180 of your style1.css file, on :hover of the li it is changing the display property of the li from inline to block:
ul li:hover {
display: block;
}
Removing this style stops this from happening.

Textbox color does not persist on focus [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Improve this question
I have created css button style as here: http://jsfiddle.net/karimkhan/SgTy2/
When I used same css insite <style> in my page then it's effect changed. looks like below:
Actual css on fiddle gives this kind of view:
I am not good at css. What's wrong I am doing here?
What if you make an external css file? The same will probably happen, so see what styles are overlapping your element in inspector mode. I would not suggest to use !important, but rather make the style have more priority. One way to do this is to make your css selector more specific.
For example:
input[name="url"]
{
background: black;
}
has more priority as
input
{
background: red;
}
jsFiddle
Note that a more specifc path also takes longer to determ.
Hope you can work on a solution now.

Why won't the background color apply? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I know the solution has to be trivial, but I am just not able to figure out why the background color from my class ('highlight') is not applying to the links marked 'sniff it here'. Sometimes it seems to apply for a moment, and then disappears. See the page here:
http://www.foodsniffr.com/blog/pumpkin-cranberry-oatmeal-cookies-vegan-vegetarian-gluten-free-healthy/
Thats weird. The included light.css (which has the .highlight style) gets rewritten to I.light.css.pagespeed.cf.kioUqT0sFU.css (which lacks that style), while the style.css isn't rewritten and throws a 404. I am assuming it's a caching problem of Wordpress, and not related to CSS.

Joomla CSS not rendering on IE or Firefox [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Improve this question
Just had a frustrating couple of hours and I figured I'd haul out the big guns and ask the intertubes.
I have a Joomla site with a 3rd party template that doesn't seem to be rendering CSS in IE8, IE9 or Firefox, however Opera, Chrome and Safari are all reading it like a boss.
Site is: http://www.quizzically.co.uk
Theme is: http://joomlathemes.co/free-orange-template-for-joomla-2.5/
The internet is abuzz with questions from upwards of four years ago with this issue, but I'm not finding anything recent. The old issues are all very personal to the sites that they happened on as well so no love on the answers I did find.
My gut feeling is that something that directs to the CSS is not being picked up or is being ignored by Firefox and IE. I don't know what this is or how to begin looking so any help that can be offered would be ecstatically accepted.
Thanks.
Line 39 of styles.css has an incorrectly coded background style:
#header-w {position:relative; background:"fff }
The " should be a # for the color.
IE and Firefox are using stricter standards than the others, so break once there's an error.
Once that's corrected, the rest of the styles will load.

Resources