A little help for an annoying css... - HTML Forums

sakinolan · 11-05-2009, 06:58 PM

Hi, i'm a newbie and i need a css help for a google api css.

At first html file is here: CLICK

and css file is here: CLICK

i want to order these 1.RSS, 2.RSS, 3.RSS, 4.RSS HORIZONTALLY.

I think a little CSS work needed, i've tried some but no success. What
i want to do is; order these 4 feeds horizontally and if i add another
5. feed, place it to the 2. row. I mean max. 4 columns for each line.

I'm a newbie on CSS so please help me with codes. Which code to change and where to put...

Thank you...

Excavator · 11-06-2009, 12:32 AM

.gfg-list {
width: 300px;
float: left; position : relative;
overflow : hidden;
text-align : left;
margin-bottom : 5px;
font-weight : bold;
background-color : 000000;
}

Those line highlighted in red will make your RSS feeds go side by side. Still need to float the .gfg-subtitle too... I would recomend putting the title in the same div as the feed if you can.

To float something, you have to give it a width. To get the 4 beside each other on one line, with 4 elements 300px wide, your .gfg-root would need to be set at 1200px wide. The fifth would automatically drop down because that's how floats work.

sakinolan · 11-06-2009, 06:02 AM

Quote:

Originally Posted by Excavator

.gfg-list {
width: 300px;
float: left; position : relative;
overflow : hidden;
text-align : left;
margin-bottom : 5px;
font-weight : bold;
background-color : 000000;
}

Those line highlighted in red will make your RSS feeds go side by side. Still need to float the .gfg-subtitle too... I would recomend putting the title in the same div as the feed if you can.

To float something, you have to give it a width. To get the 4 beside each other on one line, with 4 elements 300px wide, your .gfg-root would need to be set at 1200px wide. The fifth would automatically drop down because that's how floats work.

Thank you for your help Excavator. You save my life.

I did what you wrote but a little problem appears now:

CHECK

Feed items are not under the feed titles (1. RSS) There are a little bit on the right side. I want to display them right under the feed titles. When i try to extend the feed titles, feed items continue sliding to right side. Can we fix it? Thank you.