CSS 问题,填写表单时标题会上升

2024-03-31

我有一个奇怪的 CSS 问题,我不太确定如何解决这个问题。

当我按下网站上的“登录”按钮并开始输入用户名时,标题会上升。我真的不知道是什么原因造成的。

有任何想法吗?

Thanks!

这是一些代码:

表格:

.tooltip-wrap {
  position: fixed;
  display:none;
}

.tooltip-wrap .corner {
    position:relative;
    z-index:100;
    margin-left:-5px;
    width:0;
    height:0;
    border:5px solid transparent;
    border-bottom-color:#fff;
}

.tooltip-text { 
    float:left;
    margin-left:-50%;
    padding:1em 15px;
    background:#fff;
    color:#333;
}

这是上升的部分:

.header-navigation.back {
    z-index:-1;
    position:absolute;
    margin-left:0;
    margin-top:-6px;
    border:none;
display:block; height:137px; width:1171px; padding:0px; outline:none; text-indent:-9999px;
background-image:url('xhttp://frenchegg.com/images/backmenu.png');
}

您需要单击“用户名”并开始输入内容。


非常奇怪的错误,我无法解释发生了什么。但这与你的div.header-navigation.back。如果删除它,该行为就会消失。

据我所知,您仅将该元素用作背景图像,因此无论如何将其包含在标记中都不是一个好主意。如果您修改您的.site-header您无需额外的即可达到相同的效果div:

.site-header {
   background: #0894ff url('http://frenchegg.com/images/backmenu.png') 50% 20px no-repeat;
   background: url('http://frenchegg.com/images/backmenu.png') 50% 20px no-repeat,
               linear-gradient(to bottom, rgba(255,255,255,0.1) 0%,rgba(255,255,255,0) 100%);
}

我不太清楚你想用渐变实现什么,但想法是为支持它们的浏览器提供多种背景,并回退到纯色。

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

CSS 问题,填写表单时标题会上升 的相关文章

  • 列表视图标题和第一项之间的空白

    我创建了一个带有 ListView 的 Android 应用程序 我已将页眉和页脚添加到列表中 但是 当添加分隔符 分隔符时 它还会在标题和第一个 ListView 项之间创建一个空白空间 它对最后一个 ListView 项目和页脚执行相同
  • jQuery / Javascript - 检测 WooCommerce 商店通知 html 是否可见

    我正在寻找一种方法来确定使用 JavaScript jQuery 是否显示 WooCommerce 商店通知 商店通知的 HTML 看起来像这样 p class woocommerce store notice demo store sty
  • C# HttpClient 自定义标头每个请求

    我注意到使用 HttpClient 是NOT修改时线程安全HttpClient DefaultRequestHeaders但我想提出尽可能多的请求 我每个请求都需要一个自定义标头 其他两个标头始终相同 URL 也发生了一些变化 http e
  • 需要为每个图例文本高图应用背景颜色

    正如我在问题中所说 我希望改变我的传奇 例如 FROM TO 我已经尝试过这个背景颜色 legend backgroundColor CCC layout horizontal floating true align left vertic
  • 根据分辨率更改字体大小

    我正在开发一个网页 它的不同段落 h 等使用不同的尺寸 我在用着em sizes 字体大小 2em 举个例子 但是 当我将屏幕分辨率更改为较低的分辨率时 我希望该尺寸也较小 为此 我尝试了以下代码
  • 在 css / html 中创建六边形

    我试图在 css html 中制作几个六边形 类似于这样 http www asta uk com sites all themes asta logo png http www asta uk com sites all themes a
  • Mapbox JS SDK CSS样式表导致地图消失

    我在 VueJS 应用程序中使用 Mapbox JavaScript SDK 我可以毫无问题地显示地图 现在我想添加一些标记 我懂了在本页 https docs mapbox com mapbox gl js api 您需要先导入 CSS
  • 第二个子div高度填充父级高度

    我有一个 div 文章 它有两个子项 标题和 content outer 标题有一个正确的高度 我希望 content outer 有一个高度 没有给出具体数字 例如 200px 以便标题高度 content outer 高度 文章高度 这
  • 无法删除重叠的框阴影

    更具体地说 我使用的是聚合物纸影 我正在尝试删除一个的两侧paper shadowbox 来创建一个简单的箭头框 但我似乎无法摆脱它 我试过删除position absolute 但这似乎并没有消除重叠的行为 这是我的 html css 的
  • HTML5旋转动画——如何显示“硬币的另一面”?

    考虑到这个 JSFiddle 旋转示例 https jsfiddle net 194288aw HTML div class container div class coin div class face heads Hey div div
  • Chrome DevTools:计算样式与 css 规则不同?

    当我在 CSS 文件中定义 4px 时 我的 DOM 元素的 border top width 怎么可能是 0px 当我使用 Chrome DevTools 检查元素时 我发现计算的样式告诉 0px 而最上面的 css 规则是 4px 而且
  • 将自定义字体与 wkhtmltopdf 一起使用

    我正在尝试在使用 wkhtmltopdf 生成的 PDF 中使用自定义字体 我读到您不能使用 google webfonts 并且 wkhtmltopdf 使用 truetype ttf 文件 谁能证实这一点吗 所以我从 google we
  • 如何隐藏其他选项卡的内容并仅显示所选选项卡的内容

    当我单击特定选项卡时 其他选项卡的内容应该隐藏 但它并没有隐藏 这是我所有的代码 function showStuff id if document getElementById id style display block documen
  • iPhone 上的 Chrome 溢出空白页面上的内容(仅在新选项卡上,而不是重新加载)

    在 iOS Chrome 上 正文会在没有内容的新选项卡或页面上溢出 但如果重新加载页面 问题就会得到解决 它会给位于底部的任何元素 绝对或固定 带来问题 这是重现问题的代码
  • stripe checkout css内容策略错误

    我正在尝试创建一种形式条纹结账 https stripe com docs checkout在我的 Ionic 应用程序中 我创建了一个指令 将表单植入到我的内容视图中 但是当我运行它时 CSS 因违反内容策略而失败 checkout js
  • 您能否确定 CSS 文件的范围,使其仅适用于给定元素的后代?

    给定一个 css 文件 有没有办法限制整个文件的范围 使其仅适用于给定元素内的元素 例如给定 div span class some element span div 有没有一种方法可以将整个 css 文件的范围应用于 容器 中的所有元素
  • 如何观察包含许多 sass 文件的整个目录/文件夹的变化

    我如何跟踪包含许多 sass 文件的整个目录的更改 我正在使用以下命令来观察 sass 的变化 file sass watch style scss style css 但是如何观察包含许多 sass 文件的整个目录 文件夹的变化 只需使用
  • 在导航栏下方添加背景图片

    我想在导航栏下方添加背景图像 具有完整窗口大小的宽度 它不应覆盖整个页面长度 而是从导航栏菜单下方开始 一直向下直到特定的指定高度 但宽度是满的 我参考了以下内容 但仍然没有结果 在 Twitter Bootstrap 中的导航栏下方启动背
  • 有 CSS 父选择器吗?

    我该如何选择 li 元素是锚元素的直接父元素 举个例子 我的 CSS 应该是这样的 li lt a active property value 显然 有多种方法可以使用 JavaScript 实现此目的 但我希望 CSS Level 2 本
  • 删除

    好的 我有一个小菜单栏 菜单内的三个元素还有更多的子菜单 但是菜单栏中的元素之间有不必要的间距 而且我创建的子菜单有不必要的背景宽度 我在代码中将其涂成白色以使读者理解 由于这种不必要的宽度 即使鼠标悬停在不可见的宽度上 在本例中为白色 本

随机推荐

  • 正确预防 PHP 中的邮件注入

    你能告诉我如何预防吗电子邮件注入 http en wikipedia org wiki Email injection in PHP mail 而不丢失原始消息数据 例如 如果我需要允许用户使用 r n To CC等等 所以我不想将它们完全
  • VS 2015 中未解决 Microsoft.NETCORE.app 依赖关系

    我在使用 Visual Studio 2015 时遇到问题 当我创建新的 CORE 1 0 项目时 引用显示错误 指出 NETCoreApp 无法解析 当我打开project json 文件时 Microsoft NETCore App 带
  • 在页面内容上方浮动一个 div [重复]

    这个问题在这里已经有答案了 我实现了一个动态显示搜索选项的弹出框 我希望该框 浮动 在所有网站内容之上 目前 当显示该框时 它会取代其下方的所有内容 并且看起来很糟糕 我相信我已经尝试将框的 div 的 z index 设置为高于其余页面内
  • 恢复 SQL Server 2005 数据库后将所有用户链接到登录

    请注意 此问题询问有关链接所有用户的问题 这与询问有关链接单个用户的可能重复问题不同 我希望在两台服务器之间移动数据库 我已经从第一台服务器备份了数据库 并在第二台服务器上进行了数据库恢复 到目前为止一切顺利 然而 我们的应用程序使用了数据
  • 在后台使用 prawn 和 resque 生成 pdf

    我正在尝试通过 Resque 后台作业在后台创建 PDF 文档 我用于创建 PDF 的代码位于 Rails 辅助方法中 我想在 Resque 工作线程中使用该方法 例如 class DocumentCreator queue documen
  • php循环列表中的随机产品[关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我有来自女巫的产品列表 我需要随机显
  • Android 底页 - 滚动问题

    我需要底部纸张停在两个位置 我有以下底页代码
  • 关于 .git/HEAD 的存储库:错误:清单丢失或不可读 - 请运行 init

    我正在使用repo 在ubuntu中 下载android 4 4源代码 上次我通过按组合键 Ctrl Z 终止了 repo 进程 这次当我使用命令 repo init 和 reposync 启动它时 出现以下错误 错误 在sync Errn
  • AtomicReferenceArray 的工作原理

    我想知道 AtomicReferenceArray 是否可以用作 ConcurrentLinkedQueue 的替代品 如果可以使用有界结构 我目前有类似的东西 ConcurrentLinkedQueue
  • UITableView tableHeaderView 中的 UIButton 不响应触摸

    好吧 我觉得自己像个白痴 我无法让这个工作正常进行 而且 SO 上的其他答案都没有让我得到任何帮助 我有一个非常简单的UIView我已经在 xib 中定义并加载为tableHeaderView of my UITableViewContro
  • 从 oracle 表中恢复已删除的行

    是否可以从 oracle 表中恢复已删除的行 我的数据存储在表 MANUAL TRANSACTIONS 中 架构名称是 CCO 我不小心删除了表中的 50 万行 并且也进行了提交 现在我想恢复它们 我正在使用 Oracle 11g R2 谢
  • 为什么 Clippy 建议传递 Arc 作为参考?

    我正在检查我的代码中的 Clippy 发现 发现迂腐的规则needless pass by value https rust lang github io rust clippy master index html needless pas
  • 如何使用 Puppeteer 读取 span 元素的值

    我正在尝试进行一些网页抓取 读取 html 页面内的一些行 我需要寻找在某些页面中重复出现的文本 span 元素 在下面的示例中 我想以 文本编号 1 文本编号 2 文本编号 3 的字符串数组结尾 span Text number 1 sp
  • 用于多种翻译的可翻译实体和形式

    考虑来自以下位置的 Category 实体及其 CategoryTranslation 实体 http github com l3pp4rd DoctrineExtensions blob master doc translatable m
  • 在快速帮助文档注释中添加 Swift 类的链接?

    假设我有两个课程 This class should be used together with Foo class Bar func doNothing Description of what Foo does goes here cla
  • 通过 PHP 连接时用户的 MS SQL Native Client 登录失败

    我有一个带有 IIS 7 5 MS SQL 2012 Express 的 Windows 2008 R2 Datacenter 服务器 使用 PHP 5 6 尝试通过 Windows 身份验证连接到我创建的数据库 testDB 但未能这样做
  • “错误”类型的值没有成员“代码”[重复]

    这个问题在这里已经有答案了 我正在将一个测试应用程序移至 Xcode 8 Beta 5 并将我的代码转换为 Swift 3 关于切换到 Swift 3 我留下了一些错误Error from NSError 我在 Xcode 中收到错误消息
  • Rspec any_instance.stub 引发 nil:NilClass 异常的未定义方法 `any_instance_recorder_for'

    这是我正在测试的类Foo rb class Foo def bar return 2 end end 这是我的测试包含在Foo spec rb require Foo rb describe Foo do before all do put
  • 使用 sed 删除两个模式之间的行(不包括)

    Ok 我知道这是一个微不足道的问题 但是 我如何从文件中删除两个已知模式 单词之间的行 pattern1垃圾模式2 获得 pattern1模式2 有谁知道学习 sed 的好 简单的 资源吗 有很多清晰的例子吗 sed n pattern1
  • CSS 问题,填写表单时标题会上升

    我有一个奇怪的 CSS 问题 我不太确定如何解决这个问题 当我按下网站上的 登录 按钮并开始输入用户名时 标题会上升 我真的不知道是什么原因造成的 有任何想法吗 Thanks 这是一些代码 表格 tooltip wrap position