css-float_编程技术问答社区_程序员问答知识库

以下是关于 css-float 的编程技术问答

我有一个简单的无序列表，带有列表式式式:碟片，有些li，每两个浮动的div.问题在于，只有在Webkit浏览器(Safari，Chrome ...)上，子弹出现在列表的右侧. 请参阅随附的屏幕截图和此 fiddle 这是代码: Text1: 00,00 € Text2: 00,00 € Text3: 00,00 €

0 2023-12-01 编程技术问答社区 html webkit css-float html-lists

Webkit的浮动和显示

我遇到了WebKit浏览器(Chrome/Safari)，CSS3媒体查询，display和float>> float>>> href =" http://oo.apphb.com" rel =" noreferrer">站点.我的网页上的默认样式是将元素nav向右和display:inline-block浮动.当窗口大小为移动尺寸时，媒体查询将其重新用作:float:none; display:block.当浏览器的大小恢复到正常状态时，出现了问题:导航元件出现在其高度的数量上.这是一些图片和标记: 窗口正常，站点正确显示: 窗口移动大小，网站正确显示: 窗口大小回到正常，网站不正确显示: 这是nav的正常样式(and 是我将把IE7的东西移至单独的样式表...) nav { text-align:center; float:right; display:inline-block; *display:inline;

0 2023-12-01 编程技术问答社区 css webkit css-float media-queries

试图在bootstrap中把图片对准一列的中间位置

我试图在右侧的bootstrap列中对齐图像，并在左侧将文本包裹在左侧: https://codepen.io/freecodecamp/full/yqlyxb 我整天都在研究Flexbox和垂直对齐，而不是做我的工作(Woops)，感觉好像是时候问专家了.这是我的样子: https://codepen.io/seaplush/pen/pen/pen/pen/pen/rkvlmx .col2 img{ max-width: 100%; height: 50%; float: right; } .col2{ background-color: #cccccc; height: 50vh; display: flex; flex-wrap: wrap; align-items: center; } 感谢您的帮助，这是我的第一个网站尝试，很抱歉，如果有些混乱，请浏览;) 解决方案您可以使用Bootstrap列.只需阅读并了解有关Boo

0 2023-11-18 编程技术问答社区 css image bootstrap-4 css-float vertical-alignment

垂直和水平对齐的div

请展开JSFIDDLE，以查看"行动中的框"， http://jsfiddle.net/5fp37/ . 我希望蓝色边框盒并排对齐，但我不想在盒子上提及宽度. 这个小提琴还可以，但是一旦我删除width:400px，两个框都彼此顶部/底部.有任何线索吗? 不想指定任何东西的宽度.木板或盒子.只有最小框的宽度，因为这可能是无备件的盒子.每个人都会并排下车也不希望DIVS在重新尺寸时更改位置.垂直方向总是垂直对齐，水平始终保持水平对齐无论父母或子项目/宽度如何. 垂直盒并排放置，水平盒子彼此顶部/底部.不论容器的大小或自己的孩子的数量如何(在这种情况下为任务div) 似乎不可能.有办法吗? 想这样做: .board{ display:block; margin-right:5px; margin-left:5px; margin-top:10px; margin-bottom:10px; border: red solid th

2 2023-11-18 编程技术问答社区 css css-float css-position vertical-alignment

CSS垂直浮动技术

0 2023-11-18 编程技术问答社区 html css css-float vertical-alignment

在2个浮动的div中，CSS垂直居中

我有一个div，有2个浮动的div. 在左侧3个按钮和段落中的右侧链接上，单行. 当右侧的链接变长(或者我决定更多的bottons)时，段落将变为多行，我希望我的按钮垂直居中. 在我的示例中，大胆的名字"乔·史密斯"工作正常，但是如果变成"乔·史密斯·布朗·琼斯"，我需要按钮才能居中. 在此处查看一个示例 CSS: body { color: #CCCCCC; font-family: 'Lucida Grande', 'Trebuchet MS'; font-size: 100%; } a, a:link, a:visited, a:focus { color:#4188FB; } a:active, a:hover { color:#FFCC00; } .clearboth { clear:both; } /* header */ .admin-header { width: 700px; padding: 15px 10px; bac

0 2023-11-18 编程技术问答社区 css html css-float vertical-alignment

float:left div's的垂直对齐。

我的宽度大约有10个div，但高度变化，我希望它们尽可能紧密. 设置为float左侧时，它们不会垂直排列，而是对齐上面的"行"底部. 我在下面嘲笑了一个小例子，想摆脱空白.你有什么建议吗.我仅限于使用这种格式，因为外部交付的内容. 欢呼

2 2023-11-18 编程技术问答社区 css html css-float vertical-alignment

CSS3 display: table | cell & float?

我在其中设置了一个长的Div容器，并将其设置为display:table-cell; vertical-align: middle. 我对垂直对齐的结果感到非常满意，但是: 我不知道这3个divs的宽度，我希望其中一个位于Div容器的右侧(当然减去填充)， float: right不适用于display: table-cell. 这是一个例子(我想向右浮动金色divs).我不能使用JS.我需要它在IE7+或IE8+的IE7中工作.有提示/想法吗? http://jsfiddle.net/cz7th/2/2/2/ 解决方案我不知道这与IE7或8一起使用，但是我通过组合width: 1px，width: auto和white-space: nowrap来做到这一点.将表布局中的所有细胞定义为单像素宽，但可以防止包裹；然后在要向右漂浮的填充单元之前添加一个空填充单元. http://jsfiddle.net/wz96p/ 似乎与Chrome，Op

0 2023-11-18 编程技术问答社区 css-float vertical-alignment css-tables

H1在左边，"按钮 "在右边，垂直排列

我正在尝试在一行上显示: 与包含框左侧对齐的H1元素几个"按钮"(这里的一个元素)在包含框的右侧对齐所有人都在同一基线上可以使用最小的标记(即没有包装元素)来执行此操作，而不必设置精确的高度，线路高，保证金 - tops等. What a great title This link can kill you Click if you dare 这里的小提琴显示了我认为是两个不兼容的方向(内联块，您不能与正确的float对齐，而您不能垂直对齐): http://jsfiddle.net/glauberrocha/busvx/ 有什么想法吗? 解决方案您在该布局上存在潜在的问题 - 如果您的H1太长了，按钮也是怎么办?他们将

0 2023-11-18 编程技术问答社区 css-float vertical-alignment css alignment

多行文字垂直对齐位于浮动兄弟姐妹旁边的Div中的文字

我有两个兄弟姐妹.一个人占据了父母的70％的宽度，并漂浮在左侧.它具有创建不规则多边形的clip-path.兄弟姐妹Div的宽度为100％的父母.我在浮动的Div上放了一个shape-outside属性，以允许兄弟姐妹中的文本以遵循多边形对角线的方式包装. 我解决问题的问题是，非浮动兄弟姐妹中的文本是动态的，可以是单线或多行.我想确保文本垂直以非浮动Div为中心，并遵循shape-outside线. flex，网格和表似乎打破了文本遵循shape-outside行的能力. main { height: 25rem; width: 95vw; margin: auto; } #main-left { background-image: url('https://drive.google.com/uc?id=1NeUyxUgp7I56mTpmzYIUXbQilRnd0dAK'); background-size: cover; bac

0 2023-11-18 编程技术问答社区 html css css-float vertical-alignment

垂直对准浮动 divs

我有一个我创建的网站的一部分，如下所示: Find Products: You are logged in as Username • Log Out

0 2023-11-18 编程技术问答社区 html css vertical-alignment css-float

如何在浮动的图片旁边垂直对齐文本？

我想在浮动图像后垂直对齐跨度. 我在堆栈溢出中搜索了它，并找到这篇文章.但是我的图像是漂浮的. Doesn't work. 我给图像vertical-align:middle没有任何变化！谢谢解决方案首先从中删除float.这样写: Doesn't work. 检查此 http://jsfiddle.net/ws3uf/ 其他解决方案即使这是一个

0 2023-11-18 编程技术问答社区 css css-float vertical-alignment

将漂浮在空中的内容垂直居中

我如何将浮动div的内容(我不知道哪个高度)定为置换? 有非常简单的HTML和CSS(请参阅此小提琴: http://jsfiddle.net/deh6e/1/) This should be in the middle .floating { height: 100px; float: left; border: 1px solid red; vertical-align: middle; } 我如何使"应该在中间"的句子真正出现在中间(垂直居中)? vertical-align: middle似乎不起作用.我尝试过display: table-cell，但也没有起作用.解决此问题的最佳方法是什么?我想避免插入任何其他HTML标签，只是通过CSS进行. (只是为了清楚:我不知道容器的实际高度，而100px仅用于示例) 编辑:我希望您能理解我，所以.

0 2023-11-18 编程技术问答社区 css css-float css-position vertical-alignment

如何将浮动div垂直对齐到底部？

因为示例规则: > 如何将条形杆到底而不是顶部?现在他们坚持到容器的顶部(#bars)，但我希望它们粘在底部. 如您所见，我不知道最高条的高度，所以我不知道容器的高度. 这些Q+a没有帮助:垂直逐步对齐浮动divs ，垂直对齐浮动divs 应该很简单，对吗?如果有帮助:它只需要在体面的浏览器中工作. ps.条的数量是可变的(不是在示例中)，它们的高度为.只有它们的宽度是静态的.定位absolute无济于事，因为容器Div没有测量. 解决方案这将执行技巧: #bars { display: table-cell; border: solid 1px black; } #bars > div { display: inline-block; vertical-align: bottom; width: 5px; background-color: #999; margin-left: 2px;

0 2023-11-18 编程技术问答社区 css css-float vertical-alignment

如何将高度未知的浮动元素垂直居中|对齐？

我有一个(水平)的中心div，其中包含两个未知宽度的元素: ... ... 默认情况下，两个浮子都是顶部对齐的，并且具有变化/未知和不同的高度.有什么方法可以使它们垂直居中? 我最终做了外部div display: table 和内部divs display: table-cell; vertical-align: middle; text-align: left/right; ，但是我很好奇是否有一种使用浮子的方法. 解决方案您不能直接这样做，因为 floats 与顶部保持一致: 如果有线框，则将浮子盒的外部对齐带有当前线框的顶部. 精确规则/p> 一个浮动盒的浮动盒的外顶可能不是高于任何 blo

4 2023-11-18 编程技术问答社区 css css-float vertical-alignment

Bootstrap 3: 在list-group-item中向右浮动的Span元素不消耗垂直空间

在引导程序3 list-group-item中，我有一个图标，一些文本和两个图标/按钮，应该向右浮动. 我尝试了: Some text goes here 如果结果适合一行，则可以很好地工作: 当窗口很薄以至于实际文本不适合一行时，它也可以工作: 但是，如果窗户允许文本留在

2 2023-10-29 编程技术问答社区 css html css-float twitter-bootstrap-3

Bootstrap-浮动导航栏的右键

我正在使用Bootstrap导航栏，但是我想浮动右侧的一个按钮之一，而不是左侧.这是HTML: Toggle navigation

2 2023-10-29 编程技术问答社区 html css css-float twitter-bootstrap-3

响应式布局和列的浮动问题

我试图使用Bootstrap 3.2.0在单行中使用一系列瓷砖divs来实现这种布局，用于屏幕> 768px宽. DIV高度是单个或双重的，在此样本中，我将其设置为50px和100px，而DIV宽度由类col-sm-x控制: 到目前为止，我的最佳尝试使用以下标记和CSS: CSS .red{ background-color: red; } .blue{ background-color: blue; } .green{ background-color: green; } .yellow{ background-color: yellow; } .purple{ background-color: purple; } .home-height-single{ min-height: 50px; } .home-height-double{ min-height: 100px; } @media (min-width: 768px) { .b-col {

6 2023-10-29 编程技术问答社区 html css twitter-bootstrap twitter-bootstrap-3 css-float

Bootstrap 3在单一尺码内的多 | 列不能正常浮动

我已经在当前的Bootstrap 3上遇到了这样的问题.我过去设法以一种或另一种方式修复它们，但这次不知道如何修复它. 我需要通过在列表项目上交替pull-left&pull-right来创建一个ul中的两个列.我在做什么错? http://bootply.com/92446 解决方案您应该尝试使用网格模板. 这是我用于A 的两列布局 Row1 Row2 Row3 Row4

2 2023-10-29 编程技术问答社区 list css-float twitter-bootstrap-3 multiple-columns

Bootstrap在3列上用右拉、左拉改变div的顺序

我整天都在研究这一问题，但没有提出解决方案.我在一个容器中有3列. 1:正确的内容 - 拉右 2:导航 - 拉左 3:主要内容它在大屏幕上的外观: ------------------------------------------------ | Menu | Content | Right Content | ------------------------------------------------ 在较小的屏幕上应该看起来像什么: ---------------------------- | Menu | Right Content | | |------------------ | | Content | ---------------------------- 现在的样子: ------------------ | Right Content

4 2023-10-29 编程技术问答社区 css twitter-bootstrap css-float twitter-bootstrap-3

首页
<
1
2
3
4
5
6
7
8
>
尾页