- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我在 SB Admin v2.0 的设计中遇到了问题.我把原来的 css 修改为 RTL,但现在中间的 div 内容贯穿了整个页面。我希望它位于页面中间。
这是我的 HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server" dir="rtl">
<title>Sp</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link href="../css/bootstrap.min.css" rel="stylesheet">
<!-- MetisMenu CSS -->
<link href="../css/plugins/metisMenu/metisMenu.min.css" rel="stylesheet">
<!-- Timeline CSS -->
<link href="../css/plugins/timeline.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="../css/sb-admin-2.css" rel="stylesheet">
<!-- Morris Charts CSS -->
<link href="../css/plugins/morris.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="../font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body dir="rtl">
<form runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div id="wrapper">
<!-- Navigation -->
<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="BHome.aspx"></a>
</div>
<!-- /.navbar-header -->
<ul class="nav navbar-top-links navbar-right">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
<i class="fa fa-user fa-fw"></i><i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu dropdown-user">
<li>
<a href="../Users/Users.aspx"><i class="fa fa-gear fa-fw"></i>User Settings</a>
</li>
<li class="divider"></li>
<li>
<a href="../Login.aspx"><i class="fa fa-sign-out fa-fw"></i>Sign-out</a>
</li>
</ul>
<!-- /.dropdown-user -->
</li>
<!-- /.dropdown -->
</ul>
<!-- /.navbar-top-links -->
<div class="navbar-default sidebar" role="navigation">
<div class="sidebar-nav navbar-collapse">
<ul class="nav" id="side-menu">
<li class="sidebar-search">
<div class="input-group custom-search-form">
<input type="text" class="form-control" placeholder="...بحث">
<span class="input-group-btn">
<button class="btn btn-default" type="button">
<i class="fa fa-search"></i>
</button>
</span>
</div>
<!-- /input-group -->
</li>
<li>
<a class="active" href="BHome.aspx">
Home<i class="fa fa-dashboard fa-fw"></i>
</a>
</li>
<li>
<a href="#"><i class="fa fa-edit fa-fw"></i>Main<span class="fa arrow"></span></a>
<ul class="nav nav-second-level">
<li>
<a href="~/Customers/Customers.aspx"
title="Cusomers">Cusomers</a>
</li>
</ul>
<!-- /.nav-second-level -->
</li>
</ul>
</div>
<!-- /.sidebar-collapse -->
</div>
<!-- /.navbar-static-side -->
</nav>
<div id="page-wrapper">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">
<asp:Label ID="ContentTitleLabel" runat="server"></asp:Label>
</h1>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
<tbody>
<tr>
<td align="right">
<table style="width: 100%">
<tbody>
<tr>
<td class="ui-widget-header">رقم العميل</td>
<td>
<input name="ctl00$MainContent$txtSearchCustomerID" type="text" id="ctl00_MainContent_txtSearchCustomerID" />
</td>
<td class="ui-widget-header">اسم العميل</td>
<td>
<input name="ctl00$MainContent$txtSearchCustomerName" type="text" id="ctl00_MainContent_txtSearchCustomerName" />
</td>
<td>
<input type="submit" name="ctl00$MainContent$cmdSearch" value="بحث" id="ctl00_MainContent_cmdSearch" class="submit" />
</td>
</tr>
<tr>
<td class="ui-widget-header">العنوان</td>
<td>
<input name="ctl00$MainContent$txtSearchAddress" type="text" id="ctl00_MainContent_txtSearchAddress" />
</td>
<td class="ui-widget-header">التليفون</td>
<td>
<input name="ctl00$MainContent$txtSearchTelephone1" type="text" id="ctl00_MainContent_txtSearchTelephone1" />
</td>
<td>
<input type="submit" name="ctl00$MainContent$cmdAddNew" value="عميل جديد" id="ctl00_MainContent_cmdAddNew" class="submit" />
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td>
<span id="ctl00_MainContent_lblRecordsFound">سجلات 1</span>
<div>
<table class="PCG-Content" cellspacing="0" rules="all" border="1" id="ctl00_MainContent_grd" style="width:100%;border-collapse:collapse;">
<tbody>
<tr class="ui-widget-header">
<th class="BoundFieldHeaderStyleHidden" scope="col"> </th>
<th scope="col"><a href="javascript:__doPostBack('ctl00$MainContent$grd','Sort$Customers.CustomerID')"><div><div style="float:left;">رقم العميل</div><div class="ui-icon ui-icon-carat-2-n-s" style="float:right;"></div></div></a></th>
<th scope="col"><a href="javascript:__doPostBack('ctl00$MainContent$grd','Sort$Customers.CustomerName')"><div><div style="float:left;">اسم العميل</div><div class="ui-icon ui-icon-carat-2-n-s" style="float:right;"></div></div></a></th>
<th scope="col"><a href="javascript:__doPostBack('ctl00$MainContent$grd','Sort$Customers.Address')"><div><div style="float:left;">العنوان</div><div class="ui-icon ui-icon-carat-2-n-s" style="float:right;"></div></div></a></th>
<th scope="col"><a href="javascript:__doPostBack('ctl00$MainContent$grd','Sort$Customers.Telephone1')"><div><div style="float:left;">رقم التليفون 1</div><div class="ui-icon ui-icon-carat-2-n-s" style="float:right;"></div></div></a></th>
<th scope="col"><a href="javascript:__doPostBack('ctl00$MainContent$grd','Sort$Customers.Telephone2')"><div><div style="float:left;">رقم التليفون 2</div><div class="ui-icon ui-icon-carat-2-n-s" style="float:right;"></div></div></a></th>
<th scope="col"><a href="javascript:__doPostBack('ctl00$MainContent$grd','Sort$Customers.Telephone3')"><div><div style="float:left;">رقم التليفون 3</div><div class="ui-icon ui-icon-carat-2-n-s" style="float:right;"></div></div></a></th>
<th scope="col"> </th>
</tr>
<tr class="ui-widget-content">
<td class="BoundFieldItemStyleHidden">1</td>
<td>1</td>
<td>Name</td>
<td>Address</td>
<td>Address 2</td>
<td>7</td>
<td>8</td>
<td><input type="button" value="Edit" onclick="javascript:__doPostBack('ctl00$MainContent$grd','$0')" class="GridEditButton" /></td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<tr>
<td>
<input type="submit" name="ctl00$MainContent$cmdFirst" value="<<" id="ctl00_MainContent_cmdFirst" disabled="disabled" class="submit" />
<input type="submit" name="ctl00$MainContent$cmdPrevious" value="<" id="ctl00_MainContent_cmdPrevious" disabled="disabled" class="submit" />
<span id="ctl00_MainContent_lblPageNumber"> صفحة 1 من1</span>
<input type="submit" name="ctl00$MainContent$cmdNext" value=">" id="ctl00_MainContent_cmdNext" disabled="disabled" class="submit" />
<input type="submit" name="ctl00$MainContent$cmdLast" value=">>" id="ctl00_MainContent_cmdLast" disabled="disabled" class="submit" />
</td>
</tr>
</tbody>
</asp:ContentPlaceHolder>
</div>
<!-- /.col-lg-12 -->
</div>
<!-- /.row -->
</div>
<!-- /#page-wrapper -->
</div>
<!-- /#wrapper -->
<!-- jQuery Version 1.11.0 -->
<script src="../js/jquery-1.11.0.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="../js/bootstrap.min.js"></script>
<!-- Metis Menu Plugin JavaScript -->
<script src="../js/plugins/metisMenu/metisMenu.min.js"></script>
<!-- Morris Charts JavaScript -->
<script src="../js/plugins/morris/raphael.min.js"></script>
<script src="../js/plugins/morris/morris.min.js"></script>
<%--
<script src="../js/plugins/morris/morris-data.js"></script>--%>
<!-- Custom Theme JavaScript -->
<script src="../js/sb-admin-2.js"></script>
</form>
</body>
</html>
这是我修改后的 CSS:
#wrapper {
width: 100%;
float: right;
}
#page-wrapper {
padding: 0 15px;
min-height: 568px;
background-color: #fff;
float: right;
}
@media(min-width:768px) {
#page-wrapper {
position: inherit;
margin: 0 0 0 250px;
text-align: center;
width: 100%;
padding: 0 0 0 0px;
border-left: 1px solid #e7e7e7;
float: right;
}
}
最佳答案
您的 width: 100% 样式阻止它居中。尝试这样的事情:
#wrapper {
}
#page-wrapper {
min-height: 568px;
background-color: #fff;
}
@media(min-width:768px) {
#page-wrapper {
position: inherit;
margin: 0 auto;
text-align: center;
max-width: 700px;
padding: 0 0 0 0px;
border-left: 1px solid #e7e7e7;
}
}
它本质上归结为给元素一个宽度或最大宽度,并将左右边距设置为自动。
关于css - div 内容遍历 SB Admin v2.0 中的整个页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27475699/
我只是希望我所有的管理页面都在 /admin 下. 我的主页在 /admin但是当我单击侧栏中的用户时,它会将路径更改为 /users而不是 /admin/users . 我正在使用 rea
我在端口 8011 上设置了一个 Django 服务器,并在端口 80 上有一个 nginx 作为子目录服务。 静态文件,不错。 页面,很好。 但是当我访问/subdirectory/admin/时,
我正在尝试使用 Flask 和 Flask-SuperAdmin 自定义我的 Admin View ,但是,索引 View 和 subview 显然没有使用相同的 is_accessible 方法:
我正在尝试配置我的 .htaccess,以便当有人导航到路径 /wp-admin/admin.php?page=something 时,路径 /wp-admin/something显示在浏览器中,内容
有没有办法整体禁用分页?我希望我的所有记录都显示在一个长列表中,而不是分成几页。我现在正在使用 ListGuesser,我已经尝试过 List 和 ListGuesser,但我无法禁用分页。实际上 r
在本地部署时,我的 RA 项目呈现良好,但是,当我将构建目录复制到 S3 存储桶进行部署时,它呈现的一切都一团糟。有时它有效,但大多数时候它呈现如下图所示。它在带有 AOR 的两种环境中都能正常工作。
我试图在 Datagrid 中显示Field这是多对多关系(中间表)。 我有这些表: 组 - group_subject - 主题 一个小组可以有多个科目 一个主题可以连接多个群组 group_sub
在用于显示用户列表的 Django 管理屏幕中(带有标题,选择要更改的用户),有用户名/电子邮件等字段和员工状态。我想将用户的事件状态添加到该显示中。 尽管大多数 django-admin 自定义问题
无论如何要检查所有 firebase 事务是否在 firebase-admin nodejs 脚本中完成,并正确断开与 firebase 的连接并退出 nodejs 脚本? 目前,即使在所有事务完成后
我正在尝试使用 react-admin 将数据发送到我的自定义 API。我想发送文件,我可以看到有,我想将该数据作为多部分表单数据发送。我遇到过the base64 encoding help pag
我正在尝试在admin部分中实现带有子表单的表单。 form = Fighter() subform = FighterFightHistory() //All of his fights 我的问题如
我在编辑表单中获取记录的“更新”值时遇到了很大的麻烦。我总是得到初始记录值,即使我有一个链接到正确记录源的输入,它应该更新它。 有没有其他方法来获取 SimpleForm 的值? 我有一个简单的编辑表
开发一个不需要翻译的管理员。有没有办法完全关闭它们。就像现在一样,对于诸如通知之类的事情,它们会显示,但我也会收到有关缺少翻译键的控制台警告。 最佳答案 除了 Frederik 的回答之外,以下是禁用
开发一个不需要翻译的管理员。有没有办法完全关闭它们。就像现在一样,对于诸如通知之类的事情,它们会显示,但我也会收到有关缺少翻译键的控制台警告。 最佳答案 除了 Frederik 的回答之外,以下是禁用
我有这样的模型: class User(db.Model): __tablename__ = 'users' __table_args__ = {'mysql_engine' : 'I
我已经使用 Media 类自定义了我的内联模型。 我想自定义内联字段集以实现两件事: 为每一行添加一个按钮 按下“添加新行”时从 javascript 代码运行 我试过覆盖 tabular.html
我的所有管理员/任何 url 正在呈现管理文件,但是当我尝试只点击管理员时,它显示 404 不在这条路线上。我可以为 url/admin 创建单独的路由,但这是他们的任何其他选项。这样我只能通过单一路
虽然我使用了许多图表,如 HighCharts、Charts.js、C3、D3,但是否有人尝试过或是否有一些关于如何将任何图表框架包含在 React-admin 中的文档?我看了一些,但看起来我们必须
react-admin 文档将资源的默认路由解释为: /posts/:id 映射到 PostEdit /posts/:id/show 映射到 PostShow 我希望我的应用程序默认为查看,并且仅当用
我正在使用 react-admin 前端框架,想知道是否有办法从路由中删除“#”。我正在使用 customRoutes 属性为我们的系统提供路由集合。 ``` 最佳答案 您可以创建自己的历
我是一名优秀的程序员,十分优秀!