Skip to main content

position

Description

defines the position of a dropdown relative to the input

Type

string

Values

"left" | "right" | "top" | "bottom"

Default value

"bottom"

Example

<script>
import { Dropdown, Calendar, Text} from "wx-svelte-core";

let popup;

function cancel() {
popup = false;
}
</script>

<div class="datepicker" on:click={() => (popup = true)} >
<Text />

{#if popup }
<Dropdown {cancel} position={"top"} align={"center"}>
<Calendar value={new Date(2023, 2, 15)} />
</Dropdown>
{/if}
</div>

<style>
.datepicker {
position: relative;
width: 300px;
}

</style>

Related article: Positioning and aligning Dropdown