Intersoft Community - Style

Window Caption Bar Height

hsevand@tepum.com.tr — Fri, 23 Oct 2015 07:48:56 GMT

Hi,

How can I change the height of caption bar?

I am using rendering mode html5 and following skin settings:

<WindowSettings ContentMode="UseIFrame" ControlBox="No" enablefastwindowactivation="True" iframeallowtransparency="False" ignoreiframepadding="True" BorderType="ComplexImages" CommandButtonBorderType="ComplexImages"> <WindowStyle> <Active CssClass="dskWndAct" />
 <Normal CssClass="dskWndNrml" />
 </WindowStyle>
 <CaptionStyle>
 <Active CssClass="dskCptAct" />
 <Normal CssClass="dskCptNrml" />
 </CaptionStyle>
 <CaptionButtonStyle>
 <Active CssClass="dskCptButAct" />
 <Over CssClass="dskCptButOvr" />
 <Normal CssClass="dskCptButNrml" />
 </CaptionButtonStyle>
 <CommandButtonStyle>
 <Normal CssClass="dskCmdButNrml" />
 <Over CssClass="dskCmdButOvr" />
 <Active CssClass="dskCmdButAct" />
 </CommandButtonStyle>
 <CommandButtonDisabledStyle CssClass="dskCmdButDis" />
 <ContainerStyle CssClass="dskContainer" />
 </WindowSettings>

<ImagesSettings CaptionRightInactive="o7/right_inactive.gif" CaptionLeftInactive="o7/left_inactive.gif" CloseOver="o7/close_over.gif" ButtonCenterOver="o7/button_center_over.gif" ButtonLeftActive="o7/button_left_active.gif" ButtonRightActive="o7/button_right_active.gif" MaximizeActive="o7/max_active.gif" RestoreOver="o7/restore_over.gif" CaptionRightActive="o7/right_active.gif" CloseActive="o7/close_active.gif" ButtonLeftOver="o7/button_left_over.gif" RestoreActive="o7/restore_active.gif" MaximizeInactive="o7/max_inactive.gif" ButtonRightInactive="o7/button_right_normal.gif" RestoreInactive="o7/restore_inactive.gif" ButtonLeftInactive="o7/button_left_normal.gif" ButtonCenterInactive="o7/button_center_normal.gif" MaximizeOver="o7/max_over.gif" MinimizeInactive="o7/min_inactive.gif" CloseInactive="o7/close_inactive.gif" ButtonCenterActive="o7/button_center_active.gif" CaptionCenterInactive="o7/center_inactive.gif" MaximizeDown="o7/max_down.gif" RestoreDown="o7/restore_down.gif" MinimizeDown="o7/min_down.gif" CaptionCenterActive="o7/center_active.gif" ButtonRightOver="o7/button_right_over.gif" CaptionLeftActive="o7/left_active.gif" MinimizeOver="o7/min_over.gif" CloseDown="o7/close_down.gif" MinimizeActive="o7/min_active.gif" />

and my css is as follows:

.dskWndAct
{
 border-style: solid;
 border-color: Black;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 height: 100%;
 background-color: White;
}

.dskWndNrml
{
 border-style: solid;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-color: Black;
 font-size: 9pt;
 font-family: Segoe UI,Tahoma;
 background-color: White;
 overflow: auto;
 border-width: 1px;
 height: 100%;
}

.dskCptAct
{
 color: #15428B;
 font-family: Segoe UI,Tahoma;
 font-weight: bold;
 font-size: 9pt;
 padding-top: 3px;
}
.dskCptNrml
{
 color: Gray;
 font-size: 10pt;
 font-family: Segoe UI,Tahoma;
 cursor: default;
 padding-top: 3px;
 padding-left: 2px;
 padding-bottom: 2px;
 padding-right: 2px;
}
.dskCptButAct
{
 border-top-color: Gray;
 border-left-color: Gray;
}
.dskCptButOvr
{
 border-bottom-color: Gray;
 border-right-color: Gray;
}
.dskCptButNrml
{
 overflow: hidden;
 position: relative;
}

With these settings my caption buttons (minimize, maximize and close buttons) seems weird as you see in the attached image. If I change the style as follows and change the height of the div that contains centre_active.gif as a background from ie developer tools than it seems good.

.dskWndAct
{
 border-style: solid;
 border-color: Black;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 height: 100%;
 background-color: White;
 top: 4px !important;
}

.dskWndNrml
{
 border-style: solid;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-color: Black;
 font-size: 9pt;
 font-family: Segoe UI,Tahoma;
 background-color: White;
 overflow: auto;
 border-width: 1px;
 height: 100%;
 top: 4px !important;
}

.dskCptAct
{
 color: #15428B;
 font-family: Segoe UI,Tahoma;
 font-weight: bold;
 font-size: 9pt;
 padding-top: 3px;
 height: 28px !important;
}
.dskCptNrml
{
 color: Gray;
 font-size: 10pt;
 font-family: Segoe UI,Tahoma;
 cursor: default;
 padding-top: 3px;
 padding-left: 2px;
 padding-bottom: 2px;
 padding-right: 2px;
 height: 28px !important;
}
.dskCptButAct
{
 border-top-color: Gray;
 border-left-color: Gray;
}
.dskCptButOvr
{
 border-bottom-color: Gray;
 border-right-color: Gray;
}
.dskCptButNrml
{
 overflow: hidden;
 position: relative;
 top: 4px;
}

--------------------

<div nowrap="" style='left: 7px; top: 0px; height: 29px;right: 7px; bottom: 0px; position: absolute; background-image: url("/Rhapsody.Web.UI.Presenter/ISRes.axd?D/o7.center_active.gif"); background-repeat: repeat-x;'>

How can I change the height of caption bar to solve my problem? Or can you suggest any other solution then changing height to solve weird view of caption bar buttons.

How do I style a child table in a webgrid

neil.turner@ntd.co.uk — Thu, 09 Jun 2011 10:04:33 GMT

I'm trying to style the child tables in a webgrid and have got so far but have hit brick walls.

Could you take a look at the attached image and let me know how i can achieve losing vthe empty columns at the left and right and putting a border along the bottom (green)

How to style a child table on a webgrid

neil.turner@ntd.co.uk — Thu, 09 Jun 2011 10:02:11 GMT

I'm trying to style the child tables in a webgrid and have got so far but have hit brick walls.

Could you take a look at the attached image and let me know how i can achieve losing vthe empty columns at the left and right and putting a border along the bottom (green)

custom css width not working under ie8

lybax — Fri, 03 Dec 2010 11:28:20 GMT

Hi there!

As IS WebCombo does not provide a CssClass in the main control, as overriding LayoutSettings styles (e.g. FrameStyle) using CssClass breaks the default design, we decided to set WebCombo.Width to 100% and define the actual (expected) width in a parent div element.

This solution (workaround) was rather satisfying on IE7 and FF (a bit less), but is not working anymore on IE8. Setting Width="100%" displays the WebCombo with a size of 150px. Without setting the Width, its size is 200px (hardcoded in inner controls!!!).

So my question is: What can I do?

Why is the WebCombo designed with hardcoded style (absolute, width, font-size)?
Why isn't there any way to properly override style using css class without breaking default style and without redefining all default style?
Some default css class are available (e.g. WC4-F-N), but not on all div: why?
Why is the WebCombo HTML structure (div elements) so weird and complicated?

I'm scratching my head for hours finding a "workable" bastard solution using "!important" css keyword everywere I can, in order to ignore IS hardcoded style (e.g. width:auto !important; height:inherit !important), but I'm stuck in this poor design... please help me!

</DIV></DIV>

</TR></TBODY></TABLE>

We are working on a project for more than a year using IS solution and we still hope there will be a clean solution for all our workaround we needed. And I'm not talking about WebGrids...

This becomes URGENT!

Thank you for your feedback and help.

Nico

Font problem when changing style on row and cell

david.ahlen — Mon, 28 Jun 2010 10:07:36 GMT

Hello,

I found what seems to be an issue with the font in the grid.

When changing the style of a row and a cell programmatically the text does not get the correct font. Instead of the font used in the WebGrid it gets the standard font of the page.

As an example:

<style type="text/css">
body { font-family: Monospace; }
</style>

<ISWebGrid:WebGrid ID="WebGrid1" runat="server" DefaultStyleMode="Silver"
    UseDefaultStyle="true">
</ISWebGrid:WebGrid>

And in code behind:

 bool isEvenRow = true;

void WebGrid1_InitializeRow(object sender, RowEventArgs e)
{
	if (isEvenRow)
                e.Row.Style.BackColor = System.Drawing.Color.LightGray;

	bool isEvenColumn = true;
	foreach (WebGridCell cell in e.Row.Cells)
	{
 	   if (isEvenRow && isEvenColumn)
                    cell.Style.BackColor = System.Drawing.Color.Yellow;

	   isEvenColumn = !isEvenColumn;
	}

      	isEvenRow = !isEvenRow;
}

This example will change the background color of every even row (gray) and every even cell (yellow). At least for me the yellow cells will have Monospace as font while the rest of the cells will have the WebGrid font.

Is there a solution to this?

Regards,

David

WebCombo layout issue

lybax — Mon, 11 Jan 2010 09:16:31 GMT

2 questions (use attached txt file = aspx for demo):

1. As there is no CssClass property on WebCombos, I need to set the Width="100%" on WebCombos in order to be able to define the width in the stylesheet.

e.g. <

<div style="width:400px"><is:WebCombo ID="WebCombo2" runat="server" UseDefaultStyle="True" Width="100%" /></div> When I do so, the WebCombo's width shrinks on mouse over!!!

Do you have any other solution to avoid this using style?

2. I had the same kind of layout issue as http://www.intersoftpt.com/Community/WebCombo/Webcombo-inside-Webtab/

using a javascript collapsible panel (style.display = 'block' / 'none') containing WebCombos, resulting in unsuable WebCombos...

However, the "solution" provided looks more like a work-around than a real fix and this kind of issue is definitely a bug for me as I still need to use javascript DoResize method to fix it.

Do you have any other solution allowing me to use my collapsible panel without calling DoResize() on each WebCombo?

Thanks.

Styling a SpellChecker

ewoudt@counton.com.au — Sun, 08 Nov 2009 19:04:03 GMT

Hello,

Thanks in advance for any help,

I'm sorry if this is an obvious question, i'm new at using intersoft :-)

I have a need to change the z-index of the spellchecker and some other styles, does anybody know how i can go about this?

Is there any problem with Multiline columns in Firefox

vinsdeon — Wed, 07 Oct 2009 07:47:53 GMT

I am not able to render multiline columns correctly in FF. According to my design i put width in pixels for all columns except last one. Last one is not given any width. AutoFitColumns are enabled and isautowidth=true is set on last column. All other columns are left as it is. What i could find was that the multilines are appearing, however each line is clipped of, say a 30% of each line in the column. In short eventhough i can see it as multiline, length of data is reduced. See the screenshots. The PNG image will show show you the clipped part of the original text. And the problem doesnt occure in IE7.