html - 我的完整日历的 CSS 有问题。宽度自动没有响应

标签 html css twitter-bootstrap

我正在使用完整日历来显示一些事件日期,但宽度值有问题。我希望它能够在最低 1024x768 分辨率和其他更大的屏幕尺寸(例如 1366x768 尺寸)下正常工作 我尝试引用 fullcalendar.css 中的每个宽度值,一个一个地启用、禁用所有 css 文件,插入内联样式。有人建议使用 bootstap responsive,但效果也不佳。现在我可以看到我的日历在 1024x768 分辨率下是完美的,但在更大的分辨率下,日历和右表之间存在差距。我使用了 chrome 的工具检查元素,它说空白区域没有任何内容,例如边距或填充。

我的标题是:

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
       <!-- CSS FILES -->
    <!--[if !IE]><!-->
        <link rel="stylesheet" href="/assets/default/css/style.css" type="text/css" />
    <!--<![endif]-->
    <!--[if IE]>
        <link rel="stylesheet" type="text/css" href="/assets/default/css/all-ie-only.css" />
    <![endif]-->
    <link rel="stylesheet" href="/assets/default/css/bootstrap.min.css" type="text/css" />
    <link rel="stylesheet" href="/assets/default/css/bootstrap-responsive.css" type="text/css" />
    <link rel="stylesheet" href="/assets/default/scripts/jquery-ui-1.9.2.custom/css/smoothness/jquery-ui-1.9.2.custom.min.css" type="text/css" />
    <link rel="stylesheet" href="/assets/default/css/fullcalendar.css" type="text/css" />
    <link rel="stylesheet" href="/assets/default/css/fullcalendar.print.css" type="text/css" />
    <link href="assets/default/css/bootstrap-responsive.css" rel="stylesheet">
    <!-- END CSS FILES -->

    <!-- JS FILES -->
    <script src="/assets/default/scripts/jquery-1.8.3.min.js" type="text/javascript" ></script>
    <script src="/assets/default/scripts/jquery-ui-1.9.2.custom/js/jquery-ui-1.9.2.custom.min.js" type="text/javascript" ></script>
    <script src="/assets/default/scripts/bootstrap.min.js" type="text/javascript" ></script>
    <script src="/assets/default/scripts/fullcalendar.js" type="text/javascript" ></script>
    <!-- END JS FILES -->

    <title>Permission System</title>
</head>  

Here is a copy of my style.css:

和我的完整日历 div:

<div style="min-width: 45%; width: auto; float: left; margin-left: 0px;" id="calendar" ></div>

请帮助我,我快要发疯了!

如果您认为更容易理解,我可以向您发送 teamviewer 信息。

All codes about css and some pics

最佳答案

取出 fullcalendar.print.css 并确保您拥有完整的日历 css 和 js,以排除任何打印 css 问题。 打印 css 只应包含在打印媒体中,而不应包含在屏幕中。 看看FullCalendar Source on this page我在 header 中找不到任何对 print.css 的引用。

关于html - 我的完整日历的 CSS 有问题。宽度自动没有响应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14562853/

相关文章:

python - 如何使用用户输入作为参数运行 .py 脚本

html - css - 位置 :fixed works on desktop but not mobile

需要 Jquery/CSS 帮助来为 IE 和旧版浏览器进行回退

html - 使用 Bootstrap 站点创建菜单

jquery - 带 Bootstrap 选择的输入组插件

css - Bootstrap 3 - 展开时的导航栏颜色

javascript - Css3 第 n 个子选择器不按预期方式行事

javascript - 在一个div中获取一个div

css - 如何更改 Jqgrid 中标题和行的背景?

css - 如何从垫选择下拉输入中删除动画