Publicado em 30 de ago.

Tirando margem da pagina

Galera, é o seguinte estou desenvolvendo um sistema em asp.net com c#, só que estou com um probleminha na parte visual, eu estou adaptando um layout ao meu sistema pra não perder muito tempo, porem é o seguinte eu tentei de algumas formas já laterar essa margem que fica no topo e na lateral direita, se alguem puder me ajudar agradeço.

Discussão (6)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

codercss· 30 de ago.

Olá,

Das duas uma:

1-ou existe por ai, talvez na tag body, no css, um margin-top e outro margin-right. Se sim, mexa neles!

2-Tens um wrapper, uma div, com a largura em px menores que a página.

Mas sem postar o código fica complicado!

rafaelsouzab· 30 de ago.

codigo da master page

<body style ="align-content:stretch">

 <form runat="server" style="padding:0; max-width:100%; display:block; margin-top:0; margin-right:0;" >
 <asp:ScriptManager runat="server">
 <Scripts>
 <%--To learn more about bundling scripts in ScriptManager see [http://go.microsoft.com/fwlink/?LinkID=301884](http://go.microsoft.com/fwlink/?LinkID=301884) --%>
 <%--Framework Scripts--%>
 <asp:ScriptReference Name="MsAjaxBundle" />
 <asp:ScriptReference Name="jquery" />
 <asp:ScriptReference Name="bootstrap" />
 <asp:ScriptReference Name="respond" />
 <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js" />
 <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebUIValidation.js" />
 <asp:ScriptReference Name="MenuStandards.js" Assembly="System.Web" Path="~/Scripts/WebForms/MenuStandards.js" />
 <asp:ScriptReference Name="GridView.js" Assembly="System.Web" Path="~/Scripts/WebForms/GridView.js" />
 <asp:ScriptReference Name="DetailsView.js" Assembly="System.Web" Path="~/Scripts/WebForms/DetailsView.js" />
 <asp:ScriptReference Name="TreeView.js" Assembly="System.Web" Path="~/Scripts/WebForms/TreeView.js" />
 <asp:ScriptReference Name="WebParts.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebParts.js" />
 <asp:ScriptReference Name="Focus.js" Assembly="System.Web" Path="~/Scripts/WebForms/Focus.js" />
 <asp:ScriptReference Name="WebFormsBundle" />
 <%--Site Scripts--%>
 </Scripts>
 </asp:ScriptManager>

 <div id="wrapper">
 <nav class="navbar navbar-default navbar-cls-top " role="navigation" style="margin-bottom: 0">
 <div class="navbar-header">
 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-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="index.html">Binary admin</a>
 </div>
 <div style="color: white; padding: 15px 50px 5px 50px; float: right; font-size: 16px;">
 Last access : 30 May 2014   <a href="login.html" class="btn btn-danger square-btn-adjust">Logout</a>
 </div>
 </nav>
 <!-- /. NAV TOP -->
 <nav class="navbar-default navbar-side" role="navigation">
 <div class="sidebar-collapse">
 <ul class="nav" id="main-menu">
 <li class="text-center">
 <img src="assets/img/find_user.png" class="user-image img-responsive" />
 </li>

 <li>
 <a class="active-menu" href="index.html"><i class="fa fa-dashboard fa-3x"></i>Dashboard</a>
 </li>
 <li>
 <a href="ui.html"><i class="fa fa-desktop fa-3x"></i>UI Elements</a>
 </li>
 <li>
 <a href="tab-panel.html"><i class="fa fa-qrcode fa-3x"></i>Tabs & Panels</a>
 </li>
 <li>
 <a href="chart.html"><i class="fa fa-bar-chart-o fa-3x"></i>Morris Charts</a>
 </li>
 <li>
 <a href="table.html"><i class="fa fa-table fa-3x"></i>Table Examples</a>
 </li>
 <li>
 <a href="form.html"><i class="fa fa-edit fa-3x"></i>Forms </a>
 </li>
 <li>
 <a href="login.html"><i class="fa fa-bolt fa-3x"></i>Login</a>
 </li>
 <li>
 <a href="registeration.html"><i class="fa fa-laptop fa-3x"></i>Registeration</a>
 </li>

 <li>
 <a href="#"><i class="fa fa-sitemap fa-3x"></i>Multi-Level Dropdown<span class="fa arrow"></span></a>
 <ul class="nav nav-second-level">
 <li>
 <a href="#">Second Level Link</a>
 </li>
 <li>
 <a href="#">Second Level Link</a>
 </li>
 <li>
 <a href="#">Second Level Link<span class="fa arrow"></span></a>
 <ul class="nav nav-third-level">
 <li>
 <a href="#">Third Level Link</a>
 </li>
 <li>
 <a href="#">Third Level Link</a>
 </li>
 <li>
 <a href="#">Third Level Link</a>
 </li>

 </ul>

 </li>
 </ul>
 </li>
 <li>
 <a href="blank.html"><i class="fa fa-square-o fa-3x"></i>Blank Page</a>
 </li>
 </ul>

 </div>

 </nav>
 <!-- /. NAV SIDE -->
 <div id="page-wrapper">
 <div id="page-inner">
 <div class="row">
 <div class="col-md-12">
 <div class="container body-content">
 <asp:ContentPlaceHolder ID="MainContent" runat="server">
 </asp:ContentPlaceHolder>

 </div>

 </div>
 </div>
 <!-- /. ROW -->
 <hr />

 </div>
 <!-- /. PAGE INNER -->
 </div>
 <!-- /. PAGE WRAPPER -->
 </div>
 <!-- /. WRAPPER -->
 <!-- <div class="container body-content">
 <footer>
 <p>© <%: DateTime.Now.Year %> - My ASP.NET Application</p>
 </footer> -->

 </div>

 <!-- SCRIPTS -AT THE BOTOM TO REDUCE THE LOAD TIME-->
 <!-- JQUERY SCRIPTS -->
 <script src="assets/js/jquery-1.10.2.js"></script>
 <!-- BOOTSTRAP SCRIPTS -->
 <script src="assets/js/bootstrap.min.js"></script>
 <!-- METISMENU SCRIPTS -->
 <script src="assets/js/jquery.metisMenu.js"></script>
 <!-- CUSTOM SCRIPTS -->
 <script src="assets/js/custom.js"></script>

 </form>
</body>

codigo de um css que acompanha o template

body {

 font-family: 'Open Sans', sans-serif;
}

 #wrapper {
 width: 100%;
 background:#202020;
}

#page-wrapper {
 padding: 0px 0px;
 min-height: 100%;
 background:#F3F3F3;

}
#page-inner {
 width:100%;
 margin:10px 20px 10px 0px;
 background-color:#fff!important;
 padding:10px;
 min-height:1200px;
}

.text-center {
 text-align:center;
}
.no-boder {
 border:1px solid #f3f3f3;
}

h2 {

 color: #f00;
}

h4 {

 padding-top:10px;
}
.square-btn-adjust {
 border: 0px solid transparent;
 -webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;

}

p {

 font-size:16px;
 line-height:25px;
 padding-top:20px;
}

/*==============================================
DASHBOARD STYLES
=============================================*/

.panel-back {
 background-color:#F8F8F8;

}
 .noti-box {
min-height: 100px;
padding: 20px;
}

 .noti-box .icon-box {
display: block;
float: left;
margin: 0 15px 10px 0;
width: 70px;
height: 70px;
line-height: 75px;
vertical-align: middle;
text-align: center;
font-size: 40px;
}

.text-box p{

 margin: 0 0 3px;
}
.main-text {
 font-size: 25px;
 font-weight:600;
}
.set-icon {
 -webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;

}
 .bg-color-green {
background-color: #00CE6F;
color: #fff;
}
 .bg-color-blue {
background-color: #A95DF0;
color: #fff;
}
 .bg-color-red {
background-color: #DB0630;
color: #fff;
}
 .bg-color-brown {
background-color: #B94A00;
color: #fff;
}

 .icon-box-right {
display: block;
float: right;
margin: 0 15px 10px 0;
width: 70px;
height: 70px;
line-height: 75px;
vertical-align: middle;
text-align: center;
font-size: 40px;
}

 .main-temp-back {
background: #8702A8;
color: #FFFFFF;
font-size: 16px;
font-weight: 300;
text-align: center;
}
 .main-temp-back .text-temp {
font-size: 40px;
}
.back-dash {
 padding:20px;
 font-size:20px;
 font-weight:500;
 -webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
background-color:#2EA7EB;
color:#fff;
}
 .back-dash p {
 padding-top:16px;
 font-size:13px;
 color:#fff;
 line-height:25px;
 text-align:justify;
 }
 .back-footer-green {
 background-color: #009B50;
 border-top: 0px solid #fff;
}
 .back-footer-red {
 background-color: #AF0000;
 border-top: 0px solid #fff;
}
 .color-bottom-txt {
 color: #000;
font-size: 16px;
line-height: 30px;
}
 /*CHAT PANEL*/
 .chat-panel .panel-body {
height: 450px;
overflow-y: scroll;
}
 .chat-box {
margin: 0;
padding: 0;
list-style: none;
}
 .chat-box li {
margin-bottom: 15px;
padding-bottom: 5px;
border-bottom: 1px dotted #808080;
}
 .chat-box li.left .chat-body {
margin-left: 90px;
}
 .chat-box li .chat-body p {
margin: 0;
color: #8d8888;
}

.chat-img>img {

 margin-left:20px;
}

/*==============================================
MENU STYLES
=============================================*/

.user-image {
 margin: 25px auto;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
max-height:170px;
max-width:170px;
}

.navbar-cls-top .navbar-brand {

	color: #fff;
background: #C90000;
width: 260px;
text-align: center;
height: 60px;
font-size: 30px;
font-weight: 700;
}
.active-menu {
 background-color:#C90000!important;
}

.arrow {
 float: right;
}

.fa.arrow:before {

 content: "\f104";
}

.active > a > .fa.arrow:before {

 content: "\f107";
}

.nav-second-level li,
.nav-third-level li {

 border-bottom: none !important;
}

.nav-second-level li a {

 padding-left: 37px;
}

.nav-third-level li a {

 padding-left: 55px;
}

.sidebar-collapse , .sidebar-collapse .nav{

	background:none;
}

.sidebar-collapse .nav {

	padding:0;
}

.sidebar-collapse .nav > li > a {

	color:#fff;
	background:#202020;
	text-shadow:none;

}

.sidebar-collapse > .nav > li > a {

	padding:15px 10px;
}

.sidebar-collapse > .nav > li {

	border-bottom: 1px solid rgba(107, 108, 109, 0.19);
}

.sidebar-collapse .nav > li > a:hover,
.sidebar-collapse .nav > li > a:focus {

	background:#0A0A0A;
	outline:0;
}

.nav-second-level > li > a:before ,
.nav-third-level > li > a:before {

	content:"";
	display:block;
	position:absolute;
	left:20px;
	width:15px;
	height:1px;
	background:#ff0000;
	top:20px;
}

.nav-second-level > li > a:after,
.nav-third-level > li > a:after {

	content:"";
	display:block;
	position:absolute;
	left:20px;
	width:1px;
	height:100%;
	background:#ff0000;
	top:0px;
	z-index:10;
}

.nav-second-level > li:last-child > a:after,
.nav-third-level > li:last-child > a:after {

	height:50%;
}

.nav-third-level > li > a:after,
.nav-third-level > li > a:before {

	left:40px;
}
.navbar-side {
	border:none;
	background-color: #202020;

}
.navbar-cls-top {
	background:#4D4D4D;
	border-bottom:none;

}

.navbar-cls-top .navbar-brand:hover {

background: #C90000;
color:#fff;

}

.navbar-default {
border:0px solid black;

}
.navbar-header {
 background: #A70303;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {

background-color: #B40101;
}

.navbar-default .navbar-toggle {

border-color: #fff;
}

.navbar-default .navbar-toggle .icon-bar {

background-color: #FFF;
}

.nav > li > a > i {

 margin-right:10px;
}

/*==============================================
UI ELEMENTS STYLES
=============================================*/

.btn-circle {
width: 50px;
height: 50px;
padding: 6px 0;
 -webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
text-align: center;
font-size: 12px;
line-height: 1.428571429;
}

/*==============================================
MEDIA QUERIES
=============================================*/

@media(min-width:768px) {

 #page-wrapper{
 margin: 0 0 0 260px;
 padding: 15px 30px;
 min-height: 1200px;

 }

 .navbar-side {
 z-index: 1;
 position: absolute;
 width: 260px;
 }

 .navbar {
 border-radius: 0px;
}

}

guilomaker· 30 de ago.

Reseta o CSS

coloque

	margin: 0;
	padding: 0;
}

no inicio do seu css pra testar, se for isso ai trabalhe em seu reset ou use o normalize entre outros.

rafaelsouzab· 30 de ago.

cara eu tentei colocar esse código no começo porem não mudou nada

rafaelsouzab· 30 de ago.

seguinte a pagina pura em html e css abre normal e fica sem margem tudo tranquilo porem quando passo ela pra master page do aspx ela fica com essa margem entendeu

rafaelsouzab· 31 de ago.

Alguem ?

Seguinte a margem de cima eu consegui retirar, era um codigo asp que estava na master page, depois disso a margem lateral continuou, oq eu consegui fazer é o seguinte

eu consegui aumentar o tamanho do layout da pagina até tampar a margem, parece que a pagina esta com um tamanho definido sabe, tipo a pagina parece que esta definida para ter 1900 de largura +/- e é isso que esta atrapalhando, alguem tem alguma sugestão ?