相关疑难解决方法(0)

如何为所有浏览器垂直居中div?

我想div用CSS垂直居中.我不想要表或JavaScript,只需要纯CSS.我找到了一些解决方案,但所有这些解决方案都缺少Internet Explorer 6支持.

<body>
    <div>Div to be aligned vertically</div>
</body>
Run Code Online (Sandbox Code Playgroud)

如何div在所有主流浏览器(包括Internet Explorer 6)中垂直居中?

css cross-browser alignment vertical-alignment centering

1310
推荐指数
23
解决办法
141万
查看次数

如何垂直对齐div中的元素?

我有一个div有两个图像和一个h1.所有这些都需要在div内垂直对齐,彼此相邻.

其中一个图像需要absolute放在div中.

在所有常见浏览器上工作所需的CSS是什么?

<div id="header">
    <img src=".." ></img>
    <h1>testing...</h1>
    <img src="..."></img>
</div>
Run Code Online (Sandbox Code Playgroud)

html css vertical-alignment

722
推荐指数
15
解决办法
126万
查看次数

将div垂直居中于另一个div内

我想将一个div添加到另一个div中.

<div id="outerDiv">
    <div id="innerDiv">
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是我目前使用的CSS.

    #outerDiv{
        width: 500px;
        height: 500px;
        position:relative;
    }

    #innerDiv{
        width: 284px;
        height: 290px;
        position:absolute;
        top: 50%;
        left:50%;
        margin-top: -147px;
        margin-left: -144px;
    }
Run Code Online (Sandbox Code Playgroud)

正如你所看到的,我现在使用的方法取决于宽度和高度的值innerDiv.如果宽度/高度发生变化,我将不得不修改margin-top和值.margin-left是否有任何通用的解决方案,我可以用它来居中,innerDiv无论是什么它的大小?

我发现使用margin:auto可以将innerDiv水平对齐到中间.但是垂直中间的那个呢?

html css html5 css3

526
推荐指数
8
解决办法
59万
查看次数

中心div垂直在%高度div?

是否可以在%高度div中垂直居中?

html css

11
推荐指数
2
解决办法
1万
查看次数

jQuery flot 饼图标签格式

我正在尝试格式化我的查询浮图饼图标签和图例。

这是我迄今为止创建的内容:

在此处输入图片说明

这就是我正在尝试创建的(我使用 photoshop 完成的):

在此处输入图片说明

如您所见,我正在努力在饼图中包含百分比和值(看到百分比是粗体而值不是),并垂直居中对齐图例。

这是代码:

(function () {

    var data = [
        { label: "Sales & Marketing",  data: 9545, color: "#62A83B"},
        { label: "Research & Development",  data: 16410, color: "#2897CB"},
        { label: "General & Administration",  data: 4670, color: "#DEAB34"}
    ];

    $(document).ready(function () {
        $.plot($("#expenses-chart"), data, {
             series: {
                pie: {
                    show: true
                }
             },
             legend: {
                show: true,
                labelFormatter: function(label, series) {
                    var percent= Math.round(series.percent);
                    var number= series.data[0][1]; //kinda weird, but this is what it takes
                    return('&nbsp;<b>'+label+'</b>:&nbsp;'+ percent …
Run Code Online (Sandbox Code Playgroud)

css jquery charts flot pie-chart

3
推荐指数
1
解决办法
8822
查看次数

将<div>定位在无序列表中时的垂直对齐

我在一个<ul>元素中添加了一个搜索框作为列表项,如下所示:

<nav id="notifications-menu">
    <ul id="display-inline-block">
        <li><a class="normal calendar" onclick="showUserCalendar('/', false);" href="#">My Calendar</a></li>
        <li><a class="normal calendarteam" onclick="showTeamCalendar('/', false);" href="#">Team Calendar</a></li>

        <li><div id="global-search-wrapper">
            <input type="text" class="global-search-box" name="s" value="type search term..." />
            <input type="image" src="/images/general/blank.gif" class="global-search-submit" value="" />
        </div></li>
    </ul>
</nav>
Run Code Online (Sandbox Code Playgroud)

当应用以下CSS时,我得到以下输出.我想让列表项文本中心对齐(垂直):

在此输入图像描述

nav#notifications-menu  { 
    font-family: 'Adelle', sans-serif;
    float:right;
    height: 52px; 
    width:600px;
    min-width:300px;
    padding: 0px 18px 0px 0px;
    text-align:right;
    font-size:13px;
}


nav#notifications-menu #display-inline-block,
nav#notifications-menu #display-inline-block li {
    /* Setting a common base */
    margin: 0;
    padding: 0;

}

nav#notifications-menu #display-inline-block li { …
Run Code Online (Sandbox Code Playgroud)

html css markup css3

2
推荐指数
1
解决办法
4211
查看次数

如何在页面上垂直居中div?

如何将#box div垂直居中在页面中心?我试过vertical-align:middle; 但它不起作用.你可以在这里查看网站

这是css:

iframe {
  position: fixed;  
  width: 100vw; 
  height: 100vh;  
  border: none; 
  margin: 0; 
  padding: 0; 
  overflow: hidden; 
  z-index: 999999;
}

body {
  background-color: #000;
}

#box {
  text-align: center;
  vertical-align: middle;
}

#link {
  color: #FFF;
}

#download {
  color: #FFF;
}
Run Code Online (Sandbox Code Playgroud)

html css

1
推荐指数
1
解决办法
1万
查看次数