Joomla Templates Club 406,261 posts

[naguapot Friend naguapotJoin date: June 2009Posts: 5Downloads:0Uploads:0 Thanks: 2]

#142533

How do I set the height of the module position topsl2 where the green “Quotes of the Day” is published? I need the module in that position to be exactly the same height as the slideshow even if the amount of text in the module is not enough to fill it up. I’d also like to stop it from stretching if the text doesn’t fit in the box.

[Anonymous Moderator JA DeveloperJoin date: September 2014Posts: 9914Downloads:207Uploads:152 Thanks: 1789 Thanked: 2008 times in 1700 posts]

#311422

Hi

Open templates/ja_olivine/css/template.css file, at about line 1003, find following code:

div.module_hilite ul {
margin:0;
padding:0;
}

and change to:

div.module_hilite ul {
height:135px;
margin:0;
padding:0;
}

[naguapot Friend naguapotJoin date: June 2009Posts: 5Downloads:0Uploads:0 Thanks: 2]

#311594

Thanks, but I didn’t get it to work. I tried both IE and Firefox. Are you sure this is the right place to change the code? The height value I entered doesn’t even show up in the sourcecode of the page. Please take a look at the site.

[hawver Friend hawverJoin date: February 2008Posts: 35Downloads:0Uploads:0 Thanks: 3 Thanked: 13 times in 12 posts]

#311604

Hi naguapot,

The reason why it didn’t work is because JA Developer took the ul inside the div instead of the div itself.
Find this:

div.module_hilite {
background: url(http://template15.joomlart.com/ja_olivine/templates/ja_olivine/images/box-hilite-br.gif) no-repeat bottom right;
color: #FFFFFF;
}

Add this:
overflow: hidden;
height: 230px;

It should look like this:

div.module_hilite {
background: url(http://template15.joomlart.com/ja_olivine/templates/ja_olivine/images/box-hilite-br.gif) no-repeat bottom right;
color: #FFFFFF;
overflow: hidden;
height: 230px;
}

overflow: hidden; means that all content that doesn’t fit in the box will become invisible. If you want to have scrollbars for the content that doesn’t fit you can use

overflow: auto;

That should do it, good luck. 🙂

1 user says Thank You to hawver for this useful post

1. naguapot

[naguapot Friend naguapotJoin date: June 2009Posts: 5Downloads:0Uploads:0 Thanks: 2]

#311683

It did make the box the exact height I wanted. Now the only problem’s that the left rounded corner moves together with the text.

How do I fix this?

[naguapot Friend naguapotJoin date: June 2009Posts: 5Downloads:0Uploads:0 Thanks: 2]

#311692

I figured it out. Just added height to the bottom-left-corner-thing…

div.module_hilite {
background: url(../images/box-hilite-br.gif) no-repeat bottom right;
color: #FFFFFF;
overflow: hidden;
height: 200px;
}

div.module_hilite div {
padding: 0;
height: 100%;
background: url(../images/box-hilite-bl.gif) no-repeat bottom left;
}

[Author]

Posts