homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

Help with CSS Code

 11:38 pm on Dec 2, 2012 (gmt 0)

Can someone explain why the following pieces of code arent rendering on my page?







 1:50 am on Dec 3, 2012 (gmt 0)

Without seeing the rest of your code, including the HTML, it's impossible to tell what the problem might be. There's nothing in the CSS that you posted that would be a problem. You also need to explain what the problem is in more detail. Are the elements invisible or is it just that they aren't being styled as you expect them to be?

You should be able to use a tool like Firebug for Firefox, the Web Developer Toolbar in Firefox or Chrome, or even the Developer Tools in Internet Explorer to see which CSS rules are being applied to these elements. The CSS inspection tools they include can help you diagnose the problem pretty quickly.


 4:21 am on Dec 3, 2012 (gmt 0)

<!DOCTYPE html>
<html lang="en-ca">
<style type="text/css">
.store{display:block;margin:0 auto 0;}
<p class="metal">Test this text</p>
<img class="store" height="300" src="mockup.jpg" width="960">


 4:43 am on Dec 3, 2012 (gmt 0)

I should have added to the above that if you are going to use a font family then it should be a family of more than 1. A good fall-back these days to cover Windows, MAC, Linux is:

font-family:arial,sans-serif,'Liberation Sans',Freesans;


 4:44 am on Dec 3, 2012 (gmt 0)

nevermind, I saw sevencubed's "page" and thought that was supposed to be the troublesome code. d'oh! But it is true no one can guess what isn't working from the OP.

[edited by: not2easy at 4:49 am (utc) on Dec 3, 2012]


 4:46 am on Dec 3, 2012 (gmt 0)

^ I don't know I tried it in FF as the OP pasted it and it wasn't displaying properly either so what I offered does.


 4:52 am on Dec 3, 2012 (gmt 0)

Double doh! We're playing post-it tag. I'm confused, going to bed, good night all :)


 8:19 am on Dec 3, 2012 (gmt 0)

font-family:arial,sans-serif,'Liberation Sans',Freesans

Whoops! You mean of course

font-family:arial,'Liberation Sans',Freesans,sans-serif

otherwise the last two would never be used. But there's so much overlap between the two linux families, you probably don't need both. (codestyle dot org says that if you don't have the first, there's only a 3% chance you've got the second. At least I think that's what they're saying.)

No matter what else you've got, the last item in your font stack should always be one of the generic five font families. Assuming for the sake of discussion that you've got the nerve to assemble stacks for cursive or fantasy ;)


 10:49 am on Dec 3, 2012 (gmt 0)

@kaymeis Are you posting your css in a css file or directly to your page?

Nothing seems wrong with the code above, so it should work fine. First things to check would be:
1. Your linking to your css file correctly (its easy to miss type the location, so double check).

2. If your css is on your web page rather then a css file, check you have put your css in the correct tags as posted above.

3. If after the above, you should check that you haven't used those classes elsewhere on the site, as you may be giving more then the one command for the same class.

4. Check you have closed the tags above these lines of code, if not that could cause the code not to work in some browsers.

5. Check the web page in question in another browser and/or use firebug etc to manually enter the styling to check your not simply seeing a cached copy of the page.

Those are things you can check without help or the need to share your full code or link, so have a look at those first :)


 4:02 pm on Dec 3, 2012 (gmt 0)


One last suggestion, because I'm trying to read your mind I'm now thinking you didn't want all letters is CAPS but only the first letter of each word. If yes then substitute text-transform:uppercase; with font-variant:small-caps;

Assuming for the sake of discussion that you've got the nerve to assemble stacks for cursive or fantasy ;)

I eat cursive fantasy stacks for breakfast, with a spoon full of sugar and raspberries :)

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved