king
king

Reputation: 1344

best way to grab CSS you want to style in firebug?

im using drupal to do a theme but i think this applies to any css/html using html.

im basically going into firebug and copying the CSS PATH of an item i want to stylize.. but the CSS is MASSIVELY long.. i'm not sure if this is the right way of going about things here.

here's an image to show what i mean..

screenshot of item

im just not sure how long the CSS should be. should i jsut be copying the last part of the firebug CSS?

https://i.sstatic.net/TdX32.png

Upvotes: 0

Views: 151

Answers (3)

Lavie Tobey
Lavie Tobey

Reputation: 514

From the example you have, I would probably just use the CSS selector of:

#block-menu-menu-user-menu li {
    float: left;
}

I don't know if the ID is created by you or drupal, but it makes writing the CSS selectors easier if the IDs and class names are shorter.

Upvotes: 1

Fyodor
Fyodor

Reputation: 2843

I'm afraid that writing CSS-selectors is often a manual task, requiring knowledge of basic CSS, and that it is one of the most time consuming parts of HTML/CSS developer's work.

If we go right to your selector, very clear fact is that selector from x-path could be definitely cut to one third of its length, right before the div#block-menu... fragment. It is unnecessary to write down id's of parents when selecting target with its own id. But yet again, that optimisation requires some CSS knowledge on your side.

Upvotes: 1

Firebug will take the long path to the element you need. You have this in your code :

<ul class="menu">
    <li class="first leaf">...</li>
    <li class="last leaf">...</li>
</ul>

This might solve your problem :

.menu li {
    float: left;
}

Upvotes: 0

Related Questions