相关疑难解决方法(0)

如何使用CSS垂直居中文本?

我有一个包含文本的div元素,我想将此div的内容垂直居中对齐.

这是我的div风格:

#box {
  height: 170px;
  width: 270px;
  background: #000;
  font-size: 48px;
  color: #FFF;
  text-align: center;
}
Run Code Online (Sandbox Code Playgroud)
<div id="box">
  Lorem ipsum dolor sit
</div>
Run Code Online (Sandbox Code Playgroud)

做这个的最好方式是什么?

html css vertical-alignment

2190
推荐指数
19
解决办法
314万
查看次数

CSS中心文本(水平和垂直)在div块内

div有一套display:block.(90px heightwidth)我里面有一些文字.

我需要文本在垂直和水平方向上对齐.

我试过了text-align:center,但它不做水平部分,所以我试过vertical-align:middle但它没有用.

有任何想法吗?

html css

776
推荐指数
14
解决办法
167万
查看次数

在页面上垂直和水平居中<div>的最佳方法是什么?

<div>在页面上垂直和水平居中元素的最佳方法是什么?

我知道这margin-left: auto; margin-right: auto;将以水平为中心,但垂直做的最佳方式是什么?

html css alignment vertical-alignment centering

509
推荐指数
20
解决办法
86万
查看次数

如何在div内垂直居中<span>?

代码:

<div 
  id="theMainDiv"
  style="
    border:solid 1px gray;
    cursor:text;
    width:400px;
    padding:0px;"
>
  <span 
    id="tag1_outer" 
    style="
      background:#e2e6f0;
      padding-right:4px;
      padding-left:4px;
      border:solid 1px #9daccc;
      font:normal 11px arial;
      color:#3c3c3c"
  >as</span>
</div>
Run Code Online (Sandbox Code Playgroud)

现在渲染时,跨度对齐div的左下角.

html css center

201
推荐指数
4
解决办法
31万
查看次数

水平和垂直居中DIV

有没有办法垂直和水平地居中DIV,但重要的是,当窗口小于内容时,内容不会被切割 .div必须具有背景颜色和宽度和高度.

我总是将div与绝对定位和负边距居中,就像在提供的示例中一样.但它存在的问题是它会削减内容.有没有一种方法可以在没有这个问题的情况下使div .content居中?

我在这里有一个例子:http://jsbin.com/iquviq/1/edit

CSS:

body { margin: 0px; }

.background {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: yellow;
}

/* 
is there a better way than the absolute positioning and negative margin to center the div .content: div with background color a width and a hight?: 
*/ 


.content {
    width: 200px;
    height: 600px;
    background-color: blue;

    position:absolute;
    top:50%;
    left:50%;
    margin-left:-100px;/* half width*/
    margin-top:-300px;/* half height*/
}
Run Code Online (Sandbox Code Playgroud)

HTML:

<div class="background">
    <div …
Run Code Online (Sandbox Code Playgroud)

html css center

110
推荐指数
4
解决办法
28万
查看次数

如何将文字与图标字体垂直对齐?

我有一个非常基本的HTML混合纯文本和图标字体:

<div class="ui menu">
    <a href="t" class="item"><i class="large home basic icon"></i><span class="nav-text"> Accueil</span></a>
    <a href="" class="item"><i class="large camera retro icon"></i><span class="nav-text"> Créations</span></a>
    <a class="item"><span class="nav-text">Qui-suis je </span><i class="large help basic icon"></i></a>
</div>
Run Code Online (Sandbox Code Playgroud)

问题是图标没有完全呈现在与文本相同的高度:

在此输入图像描述

有什么建议可以解决吗?

html css fonts font-awesome

54
推荐指数
6
解决办法
9万
查看次数

在HTML/CSS中做列的最佳方法

我正在寻找一种显示3列内容的方法.我找到了一种显示环绕列的方法,但我不希望这个页面.我正在寻找一种说法

<column>
<!-- content -->
</column>
Run Code Online (Sandbox Code Playgroud)

3次,并且彼此相邻显示3列.我手边的最好例子是The Verge(http://www.theverge.com/).做这个的最好方式是什么?

html css

42
推荐指数
3
解决办法
16万
查看次数

CSS全屏div,文本在中间

我定义了一个css类,所以我可以使用div来使用所有浏览器的视口,规则如下:

.fullscreenDiv {
    background-color: #e8e8e8;
    width: 100%;
    height: auto;
    bottom: 0px;
    top: 0px;
    left: 0;
    position: absolute;
}
Run Code Online (Sandbox Code Playgroud)

现在我希望div中的文本位于屏幕的正中心,因此,垂直对齐中心和水平对齐中间,但我似乎无法找到正确的方法.

它只需要在基于webkit的浏览器上工作.

我已经尝试添加P元素内侧display设置为table-cell没有运气(居中文本的常用方法).

有什么建议?

html css webkit

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

CSS嵌套注释

有没有办法在CSS中嵌套注释?

例如,当我尝试注释掉以下两个语句时,外部注释在遇到嵌套注释中的*/时结束,而第一个语句和第二个语句的其余部分取消注释.

/*
    #container {
        width: 90%;     /* nested comment here */
        margin: 0 auto;
    }

    #container .class {
        width: 25%;
    }
*/
Run Code Online (Sandbox Code Playgroud)

当我想尝试涉及多个语句的不同样式技术时,我经常遇到这个问题.

我熟悉CSS 规范的注释及其基本原理,但也知道有一个嵌套HTML注释的解决方法,我希望有类似的CSS攻击.

有人找到了在CSS中嵌套注释的方法吗?

css comments

33
推荐指数
3
解决办法
9929
查看次数

垂直和水平对齐(中间和中间)与css

我正在练习CSS,我很困惑,我怎么能强迫我的div元素在我的页面中心(垂直和水平)(意味着跨浏览器兼容性的方式或方式)?

最好的祝福 !

css xhtml alignment

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