Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
445
layout moved in IE8 compared to IE7
posted

Hello,

I am using an ultra web toolbar and with IE7, the layout was correct, i.e buttons was left aligned. Now, using IE8, the buttons was not aligned any more: in the picture below, you could see the layout I have with IE8 from the first toolbar, and the second toolbar is the layout I would like to have; and I was with IE7.

Here is the code I used for the toolbar:

 <igtbar:UltraWebToolbar ID="ToolBarModule" runat="server" BackColor="White" BackgroundImage="../Images/gif/blueexplorer.gif"
    BorderStyle="None" Font-Names="Arial" Font-Size="8pt" ForeColor="Black" Height="16px"
    ImageDirectory="/ig_common/images/" ItemSpacing="0" ItemWidthDefault="20px" MovableImage="ig_tb_move03.gif"
    Width="800px" OnButtonClicked="ToolBarModule_ButtonClicked">
    <HoverStyle BackColor="Bisque" BackgroundImage="None" BorderColor="Navy" BorderStyle="Solid"
        BorderWidth="1px" Cursor="Default" Font-Names="Arial" Font-Size="8pt" ForeColor="Black">
    </HoverStyle>
    <SelectedStyle BackColor="Orange" BackgroundImage="OrangeExplorer.gif" BorderColor="Navy"
        BorderStyle="Solid" BorderWidth="1px" Cursor="Default" Font-Names="Arial" Font-Size="8pt"
        ForeColor="Black">
    </SelectedStyle>
    <DefaultStyle BackgroundImage="blueexplorer.gif" BorderColor="Menu" BorderStyle="Solid"
        BorderWidth="0px" Font-Names="Arial" Font-Size="8pt" ForeColor="Black">
    </DefaultStyle>
    <Items>
        <igtbar:TBarButton Key="Go2First" DisabledImage="../Images/png/dis_navigate_left2.png"
            HoverImage="" Image="../Images/png/navigate_left2.png" SelectedImage="" TargetUrlTriggerMode="OnToggleSelectOn">
            <Images>
                <DisabledImage Url="../Images/png/dis_navigate_left2.png" />
                <DefaultImage Url="../Images/png/navigate_left2.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBarButton Key="Go2Prev" DisabledImage="../Images/png/dis_navigate_left.png"
            HoverImage="" Image="../Images/png/navigate_left.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../Images/png/dis_navigate_left.png" />
                <DefaultImage Url="../Images/png/navigate_left.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBarButton Key="Go2Next" DisabledImage="../Images/png/dis_navigate_right.png"
            HoverImage="" Image="../Images/png/navigate_right.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../Images/png/dis_navigate_right.png" />
                <DefaultImage Url="../Images/png/navigate_right.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBarButton Key="Go2Last" DisabledImage="../Images/png/dis_navigate_right2.png"
            HoverImage="" Image="../Images/png/navigate_right2.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../Images/png/dis_navigate_right2.png" />
                <DefaultImage Url="../Images/png/navigate_right2.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBSeparator />
        <igtbar:TBarButton Key="new" DisabledImage="../Images/png/dis_notebook_add.png" HoverImage=""
            Image="../Images/png/notebook_add.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../Images/png/dis_notebook_add.png" />
                <DefaultImage Url="../Images/png/notebook_add.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBarButton Key="edit" DisabledImage="../Images/png/dis_edit.png" HoverImage=""
            Image="../Images/png/edit.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../Images/png/dis_edit.png" />
                <DefaultImage Url="../Images/png/edit.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBarButton Key="save" DisabledImage="../Images/bmp/dis_disk_blue_ok.bmp"
            HoverImage="" Image="../Images/png/disk_blue_ok.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../Images/png/dis_disk_blue_ok.png" />
                <DefaultImage Url="../Images/png/disk_blue_ok.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBarButton Key="cancel" DisabledImage="../Images/png/dis_disk_blue_error.png"
            HoverImage="" Image="../Images/png/disk_blue_error.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../Images/png/dis_disk_blue_error.png" />
                <DefaultImage Url="../Images/png/disk_blue_error.png" />
            </Images>
        </igtbar:TBarButton>
        <igtbar:TBarButton Key="delete" DisabledImage="../images/png/dis_garbage_ok.png"
            HoverImage="" Image="../images/png/garbage_ok.png" SelectedImage="">
            <Images>
                <DisabledImage Url="../images/png/dis_garbage_ok.png" />
                <DefaultImage Url="../images/png/garbage_ok.png" />
            </Images>
        </igtbar:TBarButton>
    </Items>
</igtbar:UltraWebToolbar>

 How could I all buttons left aligned in IE8?

Thanks for your help.

Damien