- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用一个二十十二个 wordpress 子主题,当我向导航栏添加边框时,边框的左边缘与标题图像对齐,将右侧推到上方。我如何将其居中,在两侧扩展边框 2px?
这可以在 www.valuetactics.com 上实时看到
我尝试将标题图片增加到 1004 像素,但没有效果。
这是我的子主题.css
@import url("../twentytwelve.1.6/twentytwelve/style.css");
body.custom-font-enabled {
font-family: Helvetica, Arial, sans-serif;
}
/* Increase theme width to 1000px */
@media screen and (min-width: 960px) {
.site {
max-width: 1000px;
max-width: 71.4285rem;
}
}
.ie .site { max-width: 1000px; }
footer[role="contentinfo"] {
max-width: 1000px;
max-width: 71.4285rem;
}
/* Left & Right Sidebars */
@media screen and (min-width: 600px) {
.custom-layout .site-content {
width: 50%;
margin-left: 25%;
}
.custom-layout .widget-area {
position: relative;
width: 20%;
}
.custom-layout #extra-sidebar {
float: left;
margin-left: -75%;
width: 20%;
}
}
/* IE8 and IE7 - Left and Right Sidebars */
.ie .custom-layout .site-content {
width: 50%;
margin-left: 25%;
}
.ie .custom-layout .widget-area {
float: right;
width: 20%;
position: relative;
}
.ie .custom-layout #extra-sidebar {
float: left;
margin-left: -75%;
width: 20%;
}
/*Ross customizations: */
body .site {
box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
margin-bottom: 3.42857rem;
margin-top: 3.42857rem;
padding: 0 2.85714rem;
}
.main-navigation {
margin-top: -65px;
text-align: center;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
background: rgba(0,0,0,0.7);
border: 2px solid #C4F4FF;
border-radius: 4px;
display: inline-block !important;
text-align: left;
width: 100%;
}
.main-navigation li a {
border-bottom: 0;
margin-left: 20px;
color: #C4F4FF;
font-weight:bold;
line-height: 3.692307692;
text-transform: uppercase;
white-space: nowrap;
}
.main-navigation li a:hover,
.main-navigation li a:focus {
color: #C4F4FF;
}
@import url('../twentytwelve/style.css');
body .headerContent {
margin-top:0px;
margin-bottom:0px;
overflow:visible;
}
body .site {
box-shadow:none;
}
#page {
margin-top:0px;
}
.headerContent, .headerWrapper {
background:#E6E6E6;
}
.main-navigation ul {
margin: 0;
}
.site-header {
padding: 0;
margin-bottom: 5px;
}
/* Sidebar */
.widget-area .widget {
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
padding: 10px;
border: 1px solid;
border-color: blue;
border-radius: 3px;
margin-top: 12px;
margin-top: 1.7rem;
margin-bottom: 24px;
margin-bottom: 1.7rem;
word-wrap: break-word;
background: lightblue;
}
.header-image {
margin-top: -3px;
}
这是 border: 20px 的样子,可以更清楚地说明问题: http://s22.postimg.org/st72q5fy9/menubarfail.jpg
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
background: rgba(0,0,0,0.7);
border: 20px solid #C4F4FF;
border-radius: 4px;
display: inline-block !important;
text-align: left;
width: 100%;
}
最佳答案
一旦我想通了,这是一个非常简单的修复。将边框宽度更改为 -2 而不是 2。这将边框置于容器内部,使其适合并居中放置在父级中。
关于css - 添加边框后如何在 Twenty Twelve 中重新居中导航栏?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27757927/
如果您不熟悉TwentyTwenty插件,它是一个视觉差异工具,可让您突出显示两个图像之间的差异。 我在wordpress上使用他们的插件,因为我需要在两个图像之间滑动的功能。但是,当您将鼠标悬停在图
在默认的 Twenty Twelve 主题中,当浏览器/屏幕宽度小于 600 像素时,顶部主菜单会变为一个按钮,并且功能会有所不同。我不知道是什么代码控制或设计了这个替代菜单。 Twenty Twel
在默认的 Twenty Twelve 主题中,当浏览器/屏幕宽度小于 600 像素时,顶部主菜单会变为一个按钮,并且功能会有所不同。我不知道是什么代码控制或设计了这个替代菜单。 Twenty Twel
我一直在寻找这个问题的答案,但我找不到。我知道在 21 年,它就像删除一些 CSS 一样简单。但我终其一生都无法弄清楚如何使 wordpress 3.5 中的 22 主题不响应。有人知道怎么做吗? 最
我以前对全高容器没有任何问题,至少我记得是这样。但是,最近我在自定义 Wordpress 附带的二十十四主题时遇到了问题。 我在这里要做的是将右侧栏的高度设置为与内容 div 相同。 我尝试将父 di
我正在使用 WordPress 的二十十二主题。我在页脚中添加了三个小部件列,基于 this tutorial ,其中包含您可能需要查看的所有代码。 唯一使用的额外 css: #colophon {
我正在尝试将社交图标添加到我的导航菜单中。我已经完成了以下步骤: 添加新的导航链接 CSS 类示例“menu-twitter” 在子主题文件夹“images”中创建一个 mapp 导入的 twitte
我正在使用一个二十十二个 wordpress 子主题,当我向导航栏添加边框时,边框的左边缘与标题图像对齐,将右侧推到上方。我如何将其居中,在两侧扩展边框 2px? 这可以在 www.valuetact
我正在尝试为子主题的侧边栏中的自定义菜单设置样式WordPress 的 TwentyTwelve 主题。 我正在尝试为当前菜单项提供灰色背景。 不幸的是,“父”菜单项以某种方式将背景颜色赋予了比当前
我正在为一个网站使用 Wordpress“Twenty Fifteen”主题。 我想更改侧边栏左侧的背景颜色,但我不知道该怎么做。我可以更改正文、页面、边栏等的背景,但不能更改边栏左侧区域(具有相同颜
是否有将数值转换为英文表示的 R 函数?它会像这样工作: > to.words(5) [1] "five" > to.words(23) [1] "twenty-three" 最佳答案 在 R-hel
这个问题不太可能帮助任何 future 的访问者;它只与一个小的地理区域、一个特定的时间点或一个非常狭窄的情况有关,这些情况并不普遍适用于互联网的全局受众。为了帮助使这个问题更广泛地适用,visi
我正在尝试编辑 Wordpress TwentyTwelve 主题的默认菜单。到目前为止,我已经将子菜单设为水平,但它们在 Firefox 中的对齐方式与 Chrome 中的对齐方式不同。在 Ff 中
我目前正在使用 WordPress Twenty Eleven 主题开发一个网站,我希望主导航栏在滚动后固定在屏幕顶部,就像这个右侧的段落一样页 http://fiddle.jshell.net/zs
php echo 或 print 如何将小写字母变成大写字母?还是 css 问题? 例如: echo "Against"; // Outputs AgaInst for me 在 css 中有一个父类
关闭。这个问题需要details or clarity .它目前不接受答案。 想改进这个问题吗? 通过 editing this post 添加细节并澄清问题. 关闭 7 年前。 Improve t
NSString *numberWord; NSNumber *numberValue = [NSNumber numberWithInt:125]; NSNumberFormatter *numbe
我是一名优秀的程序员,十分优秀!