I have this attached tabPanel , I want to remove this gray area, or make it white ..
Any idea how can i achieve this .
thanks
You can easily change it from CSS add these lines with desired color:
.gwt-TabBar .gwt-TabBarRest{
}
Check TabBar's CSS Style Rules for more information.
PS: If you use Firebug, you can find such stuffs without asking from someone else.
Related
Background:
- I have a custom SharePoint masterpage with custom CSS.
- I also placed a custom div into the masterpage.html
Problem:
When I use the color picker to change some font color and select "more colors…", the modal dialogue box that comes up is too small and has scroll bars.
I would like for it to auto adjust.
How do I fix this?
I tried using F12 to figure out what CSS element may be affecting it, but I am unable to figure it out.
Note: I tried removing the custom div but the problem persists.
If I get two more reputation points I can upload a picture so you can visually see what I am talking about. A picture is worth a thousand words:/
Or you can go here to see the pic.
UPDATE:
I was able to figure it out:
I update the following custom css with 300px !Important:
#contentBox
{
margin-right:20px;
margin-left:20px;
min-width:300px !Important;
}
And I added the below custom css:
.more-colors-picker
{
margin: 0px;
}
For a complete history and explanation with pictures go here
my problem is that I have a lot of AbsolutePanels in GWT an they are drawn as if they were a TabLayoutPanel ( the GUI looks like a TabLayoutPanel, however, it is not one, it is made of a lot of AbsolutePanels ).
So, now I have the problem that as soon as a lot of tabs are opened they exceed the max. width of the AbsolutePanel and so they cannot be seen anymore nor can they be clicked or anything else.
So, is it somehow possible to add a ScrollBar to this AbsolutePanel in order to scroll back and forth?
I do not think it is a good idea to post any code because everything is being done programmatically. The only thing that I would need is an example of how to accomplish a scrollbar within an AbsolutePanel. This AbsolutePanel is of a fixed width!
Thank you very much for your help in advance.
Use CSS Overflow property.
You just need to set overflow: auto;.
It can be done programmatically:
panel.getElement().getStyle().setOverflow(Overflow.AUTO);
or with CSS style sheet:
.overflowAuto {
overflow: auto;
}
and
panel.addStyleName("overflowAuto");
I have a problem, and I haven't been able to solve it or find an answer for a few days now.
My theme (BusinessLite) for some reason has set table width in css to 100px!important.
This forces the TinyMCE made Tables to shrink as much as possible, thus making them useless.
TinyMCE by default converts the set width to inline style tag, but it is ignored since !important is present on the theme CSS. I have tried doing it manually, and i can confirm it fixes the issue, but i don't know of a way to make it automatic?
Does anyone know of a way to set TinyMCE to always add !important to the table width?
You could use the content_css setting to load custom css and overwrite theme css.
You would need to issue the !important too to make it work.
I need to build a tab looking like this one:
https://www.facebook.com/auto.co.il/app_134594493332806
I know how to add an image and a comment box and i know of several "plain" ways to hide the content from non-fans, but i came across the above tab and i really like the way it shows thee content yet you cant engage it until you press the like button.
Any help please?
Thanks in advance.
Oren
Your link didn't work for me, but you can place a absolutely positioned div with a high z-index above the rest of your content to prevent the user from clicking on anything.
Update: Now that the link has been updated I see that they are doing exactly what I described above. In chrome if you right-click the background and select "inspect element" you will see the following computed style for the div:
rgba(0,0,0,0.796);
display:block;
height:1612px;
width:810px;
The content is blacked out simply with a div with a black background and some opacity. Just for fun, you can overcome their like gate (without liking) via chrome's JS console by selecting the iframe context and then entering the following:
$('.like_float_c').detach();
... now call youself a 'hacker' ;)
I set glass enabled to true of a GWT dialog box. However, when the user has scrolled down in the window, then the "glass effect" does not cover the whole window anymore.
Does anyone know how to fix that? Many thanks for any advices!
You need a css property such as
moveToPopUp.setGlassStyleName("myApp-PopupPanel-GlassStyle");
where
.myApp-PopupPanel-GlassStyle{
background-color : #333;
opacity : 0.4;
clip : rect(auto,auto,auto,auto);
}
There is no straight fix available, but you can:
1. Remove scroll when showing popup with addStyleName, removeStyleName
2. There is also other solution, but you have to change layout of your style and will limit your functionality so I do not recommend this. But if you are interested I can describe this.
try
glassPanel.setSize("100%", "100%");
where glassPanel is the name of your panel,
be sure to include the import statement.