I'm trying to edit the font sizes in my mod_k2_content K2 module.

I'm editing the k2.css file under "Modules: mod_k2_content" (line 683 approx) and changing the date created to bold:

LINE 696: div.k2ItemsBlock ul li span.moduleItemDateCreated {font-size:10px;color: #999999;font-weight: bold;}

But it doesn't make any difference to the font in the module at the front-end.

Am I editing the correct css file?

please post a link to the page if its online and also the text you are trying to change

I also cannot get the CSS override working for mod_k2_content.

Site: 50.116.122.123/~drjill/

K2 Content module title: "LATEST BLOG POST"

Here is the paths:
/templates/rt_diametric/html/mod_k2_content/drjill/css/style.css
/templates/rt_diametric/html/mod_k2_content/drjill/default.php

Wrong naming? Wrong directories? Can someone help?

Joomla! 2.5.4 K2 v2.5.7 plugin: K2 - Css4K2 1.7.2

Hi Modernmagic,
Not sure about the CSS file/folder etc - the standard K2 content module uses CSS from the standard k2.css file.
Your k2.css file currently has no styles set for this module - all empty {} apart from div.k2ItemsBlock ul li div.moduleItemIntrotext
I have looked at the head code of your page and it is using the k2.css file from the component folder - its well worth copying this over into your current template folder and make the required changes there....
If you want to make a specific change to this module, I would add the id in the "over ride" in any of the css files in your templates CSS folder (or a copy of the k2.css) eg :
#k2ModuleBox194 div.k2ItemsBlock ul li div.moduleItemIntrotext {......}
Regards
Mat

Mat,

So does that mean the the k2 content sub template is only for customizing the php?

I thought it would be like a k2 template with php and css over ride abilities. Which is what I am doing here: /templates/rt_diametric/html/com_k2/templates/drjill/drjill_style.css

From what I think you are saying is that the only way to customize the css for specific k2 content modules is not to use the "select sub template" in the mod_k2_content Basic options but to use the module id method? That seems to negate the usefulness of the MVC template over ride.

The only reason I was trying the style.css is because i did a google search and I saw other k2 sites with this setup. EX: www.asociapoliticas.com/old_site/templates/rt_affinity_j15/html/mod_k2_content/css/style.css

Thanks
Jeff

P.S. Where is the Subscribe option for this forum. I am not getting notification emails when someone replies to a post that I had replied to?

Hi Jeff,
I've not seen (cannot remember) the use of a seperate CSS file for the k2 content module - or one that uses the items container called "k2ItemsListContainer"

However this is how you could do it...
Option 1:
in module override php file add this line (adjust folder location/file names to suit your needs):

$document->addStyleSheet("www.YourWebsite.com/template/html/mod_k2_content/Default/css/Override.css",'text/css',"screen");

Option 2:
if you add extra details in your module settings (width, height, colours etc):

$css_code = '
#k2ModuleBox'.$module->id.'.scrollable {
height: '.$scrollDisplayNumber_of_ItemsVert.'px;
overflow: hidden;
position: relative;
width: '.$scrollDisplayNumber_of_ItemsHoriz.'px;
}
#k2ModuleBox'.$module->id.'.scrollable .items {
clear: both;
position: absolute;
/* height: 20000em;*/
width: 20000em;
/*width: '.$params->get('ScrollableItemWidth').'px;*/
}
#k2ModuleBox'.$module->id.'.scrollable.vertical .items {
clear: both;
position: absolute;
height: 20000em;
width: '.$params->get('ScrollableItemWidth').'px;
}
#k2ModuleBox'.$module->id.' .items li {
float: left;
width: '.$params->get('ScrollableItemWidth').'px;
}
#k2ModuleBox'.$module->id.'.scrollable.vertical .items li {
float: none;
width: '.$params->get('ScrollableItemWidth').'px;
}
#k2ModuleBox'.$module->id.'.scrollable img {
background-color: #FFFFFF;
border: 1px solid #CCCCCC;
float: left;
padding: 0px;
margin: 6px 0px 4px 16px;
}
.scrollable .active {
border: 2px solid #000000;
cursor: default;
position: relative;
}
#mid_block a.browse {
padding: 0px;
margin: 12px 0px 0px 16px;
background-color:green;
float:left;
width:30px;
height:30px;
}
#mid_block a.left {
margin-left: 80px;
background-color:blue;
float:left;
}
';
$document->addStyleDeclaration($css_code);

Option 2 is from an example I built using the default k2 content module as a base, adding FlowPlayer scrolling to the items... This calls the Jquery scrolling to act on the module by CSS ID as this allows more than one scrolliong event/direction on the page at the same time... (rather than by CSS class)

Hope this helps..
Regards
Mat
PS
Please someone add the Notify option to this forum please!!
PPS
Jeff - I have also answered your Gallery in Tag page post (getk2.org/community/New-to-K2-Ask-here-first!/9077-Image-Gallery-in-Tag-Layout) - I am the new notification system!!