6 replies [Last post]
Sheepdisease
Sheepdisease's picture
Offline
newbie
Last seen: 7 years 35 weeks ago
Joined: 2013-02-16
Posts: 10
Points: 15

I have a problem trying to get something to behave as I want it to.

http://www.shaunhillphotography.co.uk/shop/

I want the breadcrumb to be padded 25px from the top. Why wont this work?

.breadcrumb{
    padding-top: 25px;
}

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 2 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Beadcrumb is an id so you

Beadcrumb is an id so you need to use the "#" symbol inplace of the "."

#breadcrumb{
    padding-top: 25px;
}

Sheepdisease
Sheepdisease's picture
Offline
newbie
Last seen: 7 years 35 weeks ago
Joined: 2013-02-16
Posts: 10
Points: 15

Thank you for your reply.

Thank you for your reply. Unfortunately, when I checked the custom CSS I had already tried that too. It has made no difference, see the link for yourself. Any idea why?

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 23 hours 51 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9772
Points: 3854

Overridden

See http://www.shaunhillphotography.co.uk/wp-content/plugins/jigoshop/assets/css/frontend.css?ver=3.5.1 line 76. This overrides what you're doing.

#breadcrumb {
    color: #999999 !important;
    font-size: 0.92em;
    margin: 0 0 1em !important;
    overflow: hidden;
    padding: 0;
    }

Have you not installed the Firebug addon for Firefox? It showed me the issue in about 2 seconds flat. The Firebug addon is a requisite for any web developer.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Sheepdisease
Sheepdisease's picture
Offline
newbie
Last seen: 7 years 35 weeks ago
Joined: 2013-02-16
Posts: 10
Points: 15

Legend, thank you! I have

Legend, thank you! I have been using ColorZilla and CSSViewer because I use Chrome and fine Mozilla to be slow.

CSSView and 'Inspect element', which is built into the browser seem to be a pretty good combination. I imagine it is quite similar to FireBug.

I was getting really annoyed, I guess if I know that I have referred to the right element I need to look elsewhere for anything else that will clash. How did you find the problem so quickly out of interest?

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 41 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

http://csscreator.com/node/33

http://csscreator.com/node/33530 - Firebug beginners guide

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 23 hours 51 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9772
Points: 3854

Dev browsers

As a web surfer, use whichever browser you like. But as a developer, there is only one. IE lacks the serious tools you need for maintenance and debugging. IE is also a little slow on incorporating newer specifications and upgrading in general; Witness how long IE10b has been in beta. Chrome's tools, likewise; though you can use Firebug-lite as a bookmarklette (or whatever it's called — IE, too, for that matter). It's called -lite because it is not full featured. I hear that Opera has some good tools, but I'm afraid I gave up on it due to inconsistent rendering from one minor upgrade to another; not encouraging for development.

That leaves Firefox and its three critical addons:

  1. Firebug; https://addons.mozilla.org/en-us/firefox/addon/firebug/
  2. The Webdeveloper suite http://chrispederick.com/work/web-developer/
  3. DOM Inspector https://addons.mozilla.org/en-us/firefox/addon/dom-inspector-6622/

I also linked Hugo's article on Firebug for the newbie in that other thread. If you're not using these Firefox addons for Firefox as your development platform, you're just making extra work and frustration for yourself.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.