Hi all,

I have a view called 'news' = list of teasers for a particular content type =

http://i.imgur.com/pGtFE.jpg

=

http://tinyurl.com/6hgclge

I want to apply CSS (eg border) to each row in the list.

I tried this in zen-fixed.css but no effect...

.view-news .views-row {
border: 1px solid grey;
padding: 4px;
margin-bottom: 15px;
}

any suggestions please?

Thank you

Comments

anumia’s picture

Hello,

Open the source code for the rendered page in your browser. Locate your content and also locate the surrounding HTML tag. If you have the Firefox developer tool installed, you should be able to see the CSS being used easily. Also, you should be able to make necessary changes and see the effects of your change immediately. This will not make change in your original CSS file, but this will give you an idea where and which change you need to make to get the intended result.

After you figure out the changes you need to make, change the original CSS file (make a backup before changing).

Please note that the main CCS file used by Drupal is the style.css file located in the theme folder of the theme you are using.

This should do what you are trying to do. Hope this helps you a bit.

nevets’s picture

.view-news .views-row-odd,
.view-news .views-row-even, {
border: 1px solid grey;
padding: 4px;
margin-bottom: 15px;
}

(The zen theme has rules for .views-row-odd and .views-row-even)

juc1’s picture

@ nevets, awesome, thank you.

juc1’s picture

@ nevets, sorry to bug you....

re my zen page http://redsand.org/news

This view (http://redsand.org/news_view.jpg) has border-bottom:2px for each item in the list =

.views-row-odd {
border-bottom: 2px solid grey;
margin-bottom: 15px;
padding: 4px;
}

...but the border does not display correctly for the first item =

http://redsand.org/viewsborder.jpg

Here I have increased the border in firebug just to illustrate the problem (first row = problem and then the next odd row which appears correctly)...

http://redsand.org/viewsborder2.jpg

Any suggestions please for why this is happening?

thank you

nevets’s picture

In firefox it looks fine and I can not tell from your post or the images what problem your are seeing.

juc1’s picture

@ nevets

Thanks for your reply. You are correct that there is no problem. The background gradient was making me see an imaginary / non-existent problem. Thank you and sorry for being a dumbass!