将按钮文本放在一行上

2024-05-18

我的按钮文本在 safari 中显示在一行上(即使在初次单击后),但是在 google chrome 上,当您第一次到达该按​​钮时,我的按钮将显示在一行上,但是当您浏览更多帖子并再次遇到“加载更多”按钮时,文本搞砸了。这只发生在谷歌浏览器上。

when you get to the load more button the first time.. enter image description here

当您第二次到达“加载更多”按钮时..

这是我的CSS...我尝试添加宽度,尽管它解决了按钮不居中的问题

.elm-wrapper {
margin: 1em auto;
text-align: center;
}

.elm-button {
-webkit-transition: all 0.15s ease;
transition: all 0.15s ease;
background-color: #ffffff;
text-shadow: none;
    box-shadow: none;
    border: none;
    padding-top: 45px;
    padding-bottom: 25px;
font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 19px;
    color: #848484;
    outline: none;
}

.elm-button.ajax-inactive {
display: none;    
}
.elm-button.is-loading .elm-button-text {
	display: none;
}

.elm-loading-anim {
	display: none;
}

.elm-button.is-loading .elm-loading-anim {
display: block;
}


.elm-loading-icon {
width: 1.5em;
height: 1.5em;
}
.elm-button:not(.is-loading)::before {
            content: "v"; 
    font-size:11px;
    float: right;
    margin: 6px 0 0 16px;
    font-family: 'Days One', sans-serif;
}

您想尝试使用:

.btn {
   white-space: nowrap;
   text-align: center;
}

While white-space: nowrap强制按钮中的文本永不换行,您也可以使按钮display as inline-block,因此您不必指定特定的宽度。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将按钮文本放在一行上 的相关文章

  • CSS位置:绝对+动态高度

    我有 4 个 div 标签一个接一个 全在position absolute我使用它们对齐top and left 第三个 div 标签包含动态内容 并且 div 的高度根据其中的文本量而变化 然而 当我设置top and left在所有
  • 在 header.php 中设置变量但在 footer.php 中看不到

    在WordPress中 我设置了一个变量header php but in 页脚 php当我回应它时 我没有打印任何东西 为什么 gt 您不在同一范围内 因为页眉和页脚文件包含在函数体中 因此 您正在声明一个局部变量 并引用另一个局部变量
  • 浏览器特定的 CSS 属性

    在哪里可以找到完整的 浏览器特定 css 属性 参考 我的意思是一些属性 例如 moz border radius这仅适用于 Firefox 或 webkit min device pixel ratio 这些示例仅适用于指定的 Web 浏
  • 滚动时静态标题

    我编写了一个主页 现在我正在尝试构建一个标题 该标题是静态的 就像在滚动内容时不滚动一样 当内容位于其下方时 它应该保持在顶部 我找到了这个解决方案here https stackoverflow com questions 9677894
  • 如何更改引导弹出窗口箭头边框颜色而不填充它?

    我想更改弹出箭头的边框颜色 当我应用边框颜色时 箭头本身填充了颜色 我只想为弹出框主体的箭头边框提供颜色 p Click on button to see Popover p a href class btn btn primary pop
  • 如何排除CSS伪类选择器中的最后一个子元素

    我想为从 4 到 n 1 的子 div 应用特定样式 我能够从 4 到 n 执行此操作 但无法排除最后一个 div 这是 jsfiddlehttp jsfiddle net 8WLXX http jsfiddle net 8WLXX con
  • CSS:在 hsla 中使用 hsl 变量?

    假设我有一个 CSS 变量hsl定义如下 white 1 hsl 0deg 0 100 现在 我想使用相同的白色 但不透明度为 50 所以 像这样 white 2 hsla 0deg 0 100 50 有没有办法使用第一个变量 white
  • HTML / CSS 如何将图像图标添加到输入类型=“按钮”?

    我使用下面的 CSS 但它将图像放在按钮的中心 使用任何方式左对齐或右对齐图标
  • Sass 负变量值?

    我有几个 scss 选择器 其中我使用相同数量的正数和负数 如下所示 padding 0 15px 15px margin 0 15px 20px 15px 我更喜欢对所有 15px 量使用一个变量 但这不起作用 pad 15px padd
  • Bootstrap 列中的标题高度相同

    我有这样的 html bootstrap css div class container div class row div class col xs 6 col div class block div class title strong
  • jQuery能否获取未绘制的动态元素的大小

    我的意思是如果我用 jQuery 和 DOM 创建一个 Element var MainHolder document createElement div addClass box 如果我打电话MainHolder width 如果不在窗口
  • 如何使用 HTML CSS JS 创建滑块/切换来更改屏幕上的字体大小 [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 is there any way I can make this gt 所以我想制作一个滑块 切换器 用户可以拖动 滑动它来改变不同的
  • 为什么连字符 (-) 分隔的类名在 CSS 中广泛使用 [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 在浏览了一些网站和其他一些广泛使用的插件和框架中包含的一些 CSS 文件时 发现它们广泛使用连字符分隔的单词作为类名 实际上使用这样的类名有什么
  • 我无法注入带有“!important”规则的样式[重复]

    这个问题在这里已经有答案了 我尝试使用以下代码注入样式 document body style color green important Per CSS 级联引用 http www w3 org TR CSS2 cascade html
  • 调整离子卡中的图像大小

    我想显示一组图像 并在下面说明 我选择使用 Ionic 卡 我得到这个结果 第一张图片 虽然我想保留现在的相同布局 并添加描述 这是我的代码
  • 如何中和 CSS 定义而不覆盖

    有没有一种方法可以中和元素的 CSS 规则而不覆盖所有内容 例如 我正在使用 Twitter Bootstrap 它有许多预定义的 CSS 定义table 在某些地方 我不想要它们 对某些table元素 我想知道我是否可以做这样的事情 ta
  • 如何反转媒体查询中元素的顺序?

    我有两个 div 左和右 但是当屏幕小于 500px 时 左 div 成为底部 div 右 div 成为顶部 div DOM 中的第一个 div 应该显示为第二个 第二个 div 为第一个 I use display flex 然后 div
  • 如何更改 div 悬停时的跨度颜色

    我正在尝试更改 div 悬停时跨度的颜色 如何使红色汉堡按钮 即跨度 在 div 悬停时将颜色更改为黑色 PS 现在它在跨度的悬停上执行此操作 JSFiddle https jsfiddle net bjjbqct8 https jsfid
  • 当td内容太宽时,表格溢出父div

    我准备了一个 JSFiddle 来解释 向你展示我的问题 http jsfiddle net nz96C http jsfiddle net nz96C 乍一看还不错 但是当我添加一些文本时 firsttd一旦使用 tds 整个宽度 整个表
  • PHP简单的html dom解析器与wordpress冲突吗?

    PHP简单的html dom解析器与wordpress冲突吗 因为每当我尝试将其与此代码一起包含在我的标头中时 一切都变成空白 感谢您提前提供任何帮助 当我尝试在 HTML 文档中使用 PHP 包含时 我遇到了同样的问题 但当我使用func

随机推荐

  • karma/jasmine 控制台更详细的测试结果

    我使用 Karma 和 Jasmine 进行 javascript 单元测试 假设我有一个失败的测试 如下所示 expect objectA toEqual expectedObjectA 当失败时 我看到控制台上转储了两个对象 并显示一条
  • TFS 2017 - 如何构建/交付仅更改的文件?

    我正在使用 TFS 2017 关于标题 我找到了一个术语 增量构建 但是 我找不到在哪里设置它 我尝试在 构建参数 p IncrementalBuild true 中添加增量参数 但总是收到错误 表明这是错误的参数 是否可以仅交付 或构建并
  • 添加 spring-security-oauth2 后无法实例化接口 org.springframework.context.ApplicationListener

    我添加后spring security oauth2到我的 pom xml
  • 模拟对象 - 将所有方法声明为虚拟方法还是使用接口?

    与 Java 不同 net 中的方法默认不是虚拟的 为了使用大多数模拟对象框架 您要么必须将要在模拟上使用的方法标记为 真实 对象上的虚拟方法 要么必须有一个可以模拟被测试类将使用的接口接受代替执行 将每个方法标记为虚拟似乎是一种不好的形式
  • Python zmq SUB 套接字未接收 MQL5 Zmq PUB 套接字

    我正在尝试在 MQL5 中设置一个 PUB 套接字 并在 Python 中设置一个 SUB 套接字来接收消息 我在 MQL5 中有这个 include
  • 将 Windows 窗体应用程序转换为 Asp.net

    我问的是 您之前使用的将 C Windows 窗体应用程序转换为 ASP NET 的最佳工具是什么 我已经关于这个主题 发现了很多工具 但我希望有人根据他的使用情况推荐最好的工具 我真的不建议使用工具来进行转换 Web 应用程序和 WinF
  • 无法在 Visual Studio 2010 (F5) 上启动调试器但是,“附加到进程”确实有效(速度慢)。怎么修?

    环境 全新 全新 安装 Windows 7 64 位 全新 新 安装 Visual Studio 2010 Professional 10 0 30319 1 Windows 更新已是最新的 问题 我无法在 Visual Studio 20
  • 将 python2.7 与 Emacs 24.3 和 python-mode.el 一起使用

    我是 Emacs 新手 我正在尝试设置我的 python 环境 到目前为止 我已经了解到在 python 缓冲区中使用 python mode el C c C c将当前缓冲区的内容加载到交互式 python shell 中 显然使用了什么
  • jquery 插件“uploadify”-从上传脚本返回响应的方法?

    我的标题代码 document ready function sampleFile uploadify uploader include uploadify uploadify swf script add list php scriptD
  • Android 中的列表视图分页

    我有一个列表视图 其中显示了 50 个元素 我决定对视图进行分页 以便视图的每个部分都有 10 个元素 然后单击 下一个 按钮以获取下一个 10 个元素 如何设置10个数据 我关注这篇文章http rakhi577 wordpress co
  • Java-如何将黑白图像加载到二进制中?

    我在 FSE 模式下使用 Java 和 swing 我想将完全黑白图像加载为二进制格式 最好是二维数组 并将其用于基于掩码的每像素碰撞检测 我什至不知道从哪里开始 过去一个小时我一直在研究 但没有找到任何相关的东西 只需将其读入Buffer
  • Nodejs 调试生产中的错误

    我有一个在生产环境中运行的 Nodejs 脚本 我不太可能 千分之一 遇到这样的错误 TypeError value is out of bounds at checkInt buffer js 1009 11 at Buffer writ
  • 是通过指针传递的吗?

    void func char buf buf 我应该称之为按指针传递还是仅按值传递 值是指针类型 在这种情况下 传入的原始指针会被更改吗 这是按值传递 void func char b b new char 4 int main char
  • QSerialPort 中的 readAll() 不包括最后发送的响应

    我正在使用 Qt 来控制串行设备 如果我向串行设备发送命令 我会执行类似的操作serial gt write command r n 我制作了一个按钮 它将纯文本小部件内的文本更改为串行端口的响应 为了获得串口的响应 我使用serial g
  • Cassandra CQL v3.0 和复合类型

    我正在浏览以下文档CQLv3 0 http www datastax com docs 1 1 references cql index 我们是否应该在更新中指定复合键并选择 a b 1 以防万一comparator or key vali
  • Quantmod 的简单功能不再起作用

    我明天要交论文 我收到了一条关于 quantmod 的非常奇怪的错误消息 这是我在过去几周使用这个包时从未遇到过的 我无法导入特定于道琼斯指数 DJI 的数据 我收到以下错误消息 getSymbols DJI src yahoo from
  • 列出 R 数据文件的内容而不加载

    我有时用print load myDataFile RData 当我加载数据文件时列出它的内容 有没有办法列出内容而不加载数据文件中包含的对象 我认为如果不加载对象就无法做到这一点 解决方案可能是使用包装器将 R 对象保存到save 该函数
  • 独立滚动矩阵的行

    我有一个矩阵 准确地说 是 2d numpy ndarray A np array 4 0 0 1 2 3 0 0 5 我想滚动每一行A根据另一个数组中的滚动值独立地 r np array 2 0 1 也就是说 我想这样做 print np
  • 为什么这行带有“await”的代码会触发微任务队列处理?

    以下引用是我理解微任务队列处理的主要参考 当 JS 堆栈清空时 就会处理微任务 承诺使用 杰克 阿奇博尔德 https twitter com jaffathecake status 954653170986311680 这对我来说没有意义
  • 将按钮文本放在一行上

    我的按钮文本在 safari 中显示在一行上 即使在初次单击后 但是在 google chrome 上 当您第一次到达该按 钮时 我的按钮将显示在一行上 但是当您浏览更多帖子并再次遇到 加载更多 按钮时 文本搞砸了 这只发生在谷歌浏览器上