This topic contains 2 replies, has 2 voices, and was last updated by jqwidgetsdev 5 months ago.
Viewing 3 posts - 1 through 3 (of 3 total)
Viewing 3 posts - 1 through 3 (of 3 total)
You must be logged in to reply to this topic.
jQuery UI Widgets › Forums › Vue › jqxWindow align icon in title
Tagged: jqxWindow icon alignment
This topic contains 2 replies, has 2 voices, and was last updated by jqwidgetsdev 5 months ago.
Hi,
I am trying to add an icon to align right in JqxWindow, but failing to do so.
See code below, can you please provide the solution to resolve the problem?
Thank you.
<template>
<JqxWindow
ref="jqxWindow"
:width="'100%'"
:height="600"
:position="'{ x: 0, y: 0}'"
:isModal="false"
:autoOpen="true"
:draggable="false"
:showCollapseButton="true"
:animationType="'combined'"
>
<div>
<div>
hello world
<div style="float: right">
<div><i class="fa fa-question" aria-hidden="true"></i></div>
</div>
</div>
</div>
<div>
body
</div>
</JqxWindow>
</template>
<script type="text/javascript" src="../scripts/blikvm.js"></script>
<script>
import JqxWindow from "jqwidgets-scripts/jqwidgets-vue/vue_jqxwindow.vue";
export default {
name: "App",
components: {
JqxWindow,
},
};
</script>
<style>
@import "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css";
</style>
Hi,
Look at this demo: https://codesandbox.io/s/strange-lederberg-f8zx3q?file=/src/App.vue
I am setting the div which is a child of jqx-window-header to have a width of 100%.
The header-wrapper will be displayed as flex and with content justified: space-between.
Best regards,
Svetoslav Borislavov
jQWidgets Team
https://www.jqwidgets.com/
It works like a charm.
Thanks so much Svetoslav!
You must be logged in to reply to this topic.