• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

RM 1.0 css for resource stats width

Morgain

Well-known member
#1
I was fiddling with the width of in the resource list item.


In resource_list.css I was fiddling with the width of the resource stats block
(What I do is make a small change directly in the template and adjust till I get it right then transfer it to EXTRA.css once it looks the way I want.)
Anyway I tired 150px - bit narrow - tried 170px and all of a sudden it went hugely wide!
Now I can't get it to respond.

Here it is in

Code:
    .resourceListItem .resourcStats
    {
        width: 200px;
        font-size: 11px;
    }
Here's what I then put in EXTRA.css

Code:
/* ARTICLES or CATEGORY LIST ITEM */
 
.resourceListItem .resourcStats
{
width: 170px !important;
}
 

Morgain

Well-known member
#3
I have made a mess and need a rescue from my seniors.
I have reverted all I did but still got this weird layout.

The main resource list
http://www.housemorgain.co.uk/oval/resources/

and the category list
http://www.housemorgain.co.uk/oval/resources/categories/rm-conversion.2/

and still not seeing the stats any narrower.

Here;s my EXTRA.css

Code:
/* ARTICLES LIST / CATEGORIES SIDEBAR ON RIGHT Brogan*/
.resourceListSidebar {
float: right;
 
.resourceListMain {
margin-right: 250px;
margin-left: 10px  !important;
}
 
.resourceListSidebar {
    width: 205px !important;
}
 
/* ARTICLES or CATEGORY LIST ITEM */
.resourceListItem .main .tagLine {
    margin-bottom: 5px;}
.resourceListItem .resourceStats {
width: 170px !important;
}
 

Morgain

Well-known member
#5
Tried that Shelley thank you. Not succeeding yet.

Testing
Remove dEXTRA.css stuff re float/margin/ sidebar = all is OK. Default left margin.

list_items.css shows margin-left: 230px; which is the correct default.
resource_list_item and
resource_list.css are both reverted to default.

Try EXTRA.css agaim
Code:
/* ARTICLES LIST / CATEGORIES SIDEBAR ON RIGHT Brogan*/
.resourceListSidebar {
float: right !important;
)
.resourceListMain {
margin-right: 230px !important;
margin-left: 10px  !important;
}
The list items now split. The first one displays then the rest of them show up under the sidebar.
It seems also that the main section is also floating right. Adding a float left to it had no effect.
Code:
.resourceListMain {
float: left !important;
margin-left: 10px  !important;
margin-right: 230px !important;
}
Nor do I like controlling via so many !important tags anyway. It suggests something is fighting me :( so would rather discover what's up. If Shelley or Brogan would care to access my board that's very welcome.
 

Shelley

Well-known member
#6
I'm unsure what your trying to do but if your wanting to move the sidebar to the right I added the following in extra

Code:
.resourceListSidebar {
    float: right !important; }
.resourceListMain {
    margin-right: 230px;
    margin-left: 0 !important;
}
You can see the output of that code here. http://www.bbsmiley.com/resources/

Brogan is probably best helping you in your templates though. But I'm sure i am misunderstanding what your trying to accomplish.
 

Shelley

Well-known member
#7
And if your wanting to narrow the sidebar down a little to 170px the following will work nicely. (still unsure what your wanting to accomplish so i'm guessing) sorry.

So whatever width size you want to go with just increase the margin right by 10px. Example: if you wanted the width of the sidebar to be 180px the margin-right would be set to 190px

Code:
.resourceListSidebar {
    float: right !important;
    width: 170px !important; }
.resourceListMain {
    margin-right: 180px;
    margin-left: 0 !important; }