Problems with style="float:right;"

[aorlicMember]

Hello!

I just suspect this problem has to do with the DockPanel, maybe it does not.

The above code shows my code that sets up the layout for a wizard-like interface. I would like to place buttons on the extreme right of the bottom dock panel. Therefore, I use float:right style. However this does not work (the button is displayed on the extreme left of his container, instead of the right. BTW, whole DockPanel is inside a Window…

Any ideas?

Here is my code:

$(document).ready(function () {

// construct the layout
$(‘#npr_dck_main’).jqxDockPanel({ width: ‘100%’, height:560});
$(‘#npr_dck_left’).jqxDockPanel({width: ‘120px’});
$(‘#npr_dck_bottom’).jqxDockPanel({height: ’30px’});
$(‘#npr_dck_main’).jqxDockPanel(‘render’);

// buttons
$(‘#mpr_btn_cancel’).jqxButton({ width: ’80px’, height: ’30px’, theme: PMD.theme });
}); // $(document).ready(function () {

[Peter StoevKeymaster]

Hi aorlic,

jqxDockPanel does not support percentage Width and Height in this version. May be this is related to your issue. In addition, it is a layout plug-in so you shouldn’t set ‘floats’ of the HTML elements inside it. The DockPanel will layout its elements depending on their attributes.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[aorlicMember]

Thank you Peter.

Do you have any suggestion than, what would be the best way to position my buttons on the extreme right?

[Peter StoevKeymaster]

Hi aorlic,

You can take a look at the DockPanel’s sample here: dockpanel.htm.

By setting the dock attribute, you specify the element’s position in the layout.

        $('#first').attr('dock', 'left');
        $('#second').attr('dock', 'left');
        $('#third').attr('dock', 'left');
        $('#fourth').attr('dock', 'right');

When you set the ‘dock’ attribute of the HTML Element, then call:

$('#jqxDockPanel').jqxDockPanel('render');

The above code will arrange the elements.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[aorlicMember]

Thank you Peter, I resolved the problem using tables instead of DockPanels… I think it is even better, as I anyway expect to have many widgets on the page.

[Author]

Posts