当我重新调整浏览器大小时，页面组件将重叠

Question

我的网页内有以下组件;日历和日期选择器： -

我将日历的布局设置为日期选择器，如下所示： -

.calender
{
 Width:75% !important;

    }

#datepicker{

position:absolute;
right:5%;
top:5%;
}

现在如果浏览器最大化，布局就可以了，但是当我重新调整浏览器大小时，日期选择器和日历将叠加如下： -

那么有人可以建议如何解决这个布局问题，所以日历和日期纠察队不重叠吗？ 此致

Answer 1

你可以做：

clear:both;

如果日历不是绝对的，那么除此之外 - 您可以使用媒体查询将日历的百分比调整为更高的数字，以使其不重叠。

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries是了解媒体查询的好文章。

Answer 2

如果您希望他们在该位置并且不希望他们位于顶部，则我首先表示日历，然后是日期选择器，然后尝试设置父控件的min-width和overflow:scroll。

休息你可以修改css为

.calender
{
 Width:75% !important;
position: relative;
float:left;
    }

#datepicker{
position:relative;
float : right;
right:5%;
top:5%;
}

尝试一下，如果你可以调出演示然后请做:)