Conf5 - Content by Label macro - IE9 scrolling issue

Hello all,

when we create a list of pages with a certain label using the Content by Label Macro Confluence renders it with little scroll bars, which can distract the user (please see the green arrow).

Have you faced similar behavior and can recommend how to avoid it?

Many Thanks

Iakov

1 answer

1 accepted

This widget could not be displayed.

Hi lakov,

Try to fix it via stylesheets.

In admin console locate Look&Feel and there Stylesheet.

Next add class for this elements to hide scrollbars.

I guess it could be somethink like that:

.content-by-label{
 overflow:hidden !important;
}

Maybe you have to set it for overflow-y.

This will work in IE 9+.

I hope it will help you

Hi Ales,

thanks for your quick response.

Yes, the name of the class is '.content-by-label'. Can You explain to me what the property 'overflow' does?

Where would You recommend to read up on CSS properties?

I've tried your code and the following code so far:

.content-by-label{
 overflow-y: hidden !important;
}

Kind Regards

Iakov

So it is ok? :) I hope that yes.

There are a lot of CSS, but for me is best this:

  • Using Google Chrome for Developer Tools (others browser have i too, but Chrome is Chrome :) ). Here you can visit any element of page and find it in source code and on roght side are all styles which are used for selected element
  • For all infos about CSS is best W3C School (www consorcium), on their site you can looking for all properties with examples. http://www.w3schools.com/cssref/default.asp

About overflow: By this you can said that how to show elements which are bigger than their containers. So when you have a div element with fix size and inner element what is bigger that parent div, then you can set overflow (set scrollbars mainly). I hope that you understand me :) But you can look for it on their site.

Hello Ales,

thank you for your answer and the links.

The code I'm using now looks like this:

.content-by-label > li {
 overflow: hidden;
}

It works perfectly in my personal space but doesn't seem to work in other spaces. Any idea?

/Iakov

So then try to use developer tools in Chrome. Then you can see on right side of panel used CSS styles and there you can find that if it this applied or not.

If you using it in global stylesheet, keep using !important! :) Description of !important.

Hi Ales,

obviously this is the right track. Many thanks for your help.

If I find out what's exactly the trick I'll post it here.

KR

Iakov

I am glad to help you :)

Have a nice day!

Ales

Suggest an answer

Log in or Sign up to answer
Community showcase
Posted Monday in Confluence

Why start from scratch? Introducing four new templates for Confluence Cloud

Hi my Community friends!  For those who don't know me, I'm a product marketer on the Confluence Cloud team - nice to meet you! For those of you who do, you know that I've been all up in your Co...

400 views 4 6
Join discussion

Atlassian User Groups

Connect with like-minded Atlassian users at free events near you!

Find a group

Connect with like-minded Atlassian users at free events near you!

Find my local user group

Unfortunately there are no AUG chapters near you at the moment.

Start an AUG

You're one step closer to meeting fellow Atlassian users at your local meet up. Learn more about AUGs

Groups near you