Masterpage in asp.net CSS - c#

My masterpage code:
<head runat="server">
<title>System</title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
<style>
.masterfixed { table-layout:fixed; color:rebeccapurple}
.masterfixed td { overflow: hidden;}
</style>
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" >
<link href="bootstrap/css/masdesign.css" rel="stylesheet" type="text/css" >
I only want my colour on my masterpage. But why does this apply to all my font in my contentplaceholder. Please help thanks.

You could put your contentplaceholder in a div and give the div the CSS class or the style you want:
<div style="font:bold 12px arial;color:#000000">
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</div>
If it does not work, try it with a !important at the end of each style:
sytle="color:#000000 !important"
This makes sure that the div uses this style and not a style defined in a CSS class.

Related

Why Bootstrap CSS class table-striped not working in asp.net?

I'm new to Asp.net and bootstrap. I referenced bootstrap.min.css in my html and I have gridview control I want to style with "table table-striped" class. Visual studio intelisens seems to fail to recognize table-striped class and it's not working when the program runs. Any ideas what I'm doing wrong?
Here's my html source:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="NotDelivered.aspx.cs" Inherits="PapaBobs.NotDelivered" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="Content/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
<form id="form1" runat="server" class ="container">
<div class ="form-group">
<asp:GridView ID="notDeliveredGrid" runat="server" CssClass ="table table-hover table-striped"></asp:GridView>
</div>
</form>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/jquery-3.3.1.min.js"></script>
</body>
</html>
Your current href value specifies relative path to css file and browser just cannot load it because this path doesn't exist. Update link to the following
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
Also consider using bundling.

Get page dimensions using JavaScript in a Content Page

I am trying to use a javascript method in a content page (Referencing master page) to get the current screen dimensions, and write it to a label.
So far, I have had no luck. I tried doing it in both the master, and content page, but the method is simply not working.
Could someone please provide the solution for this?
MasterPage:
<head runat="server">
<title>Lake, Smit People</title>
<!--[if IE ]>
<link rel="stylesheet" type="text/css" href="ProfileStypeSheetIE.css" />
<![endif]-->
<!--[if !IE]>-->
<link href="ProfileStypeSheet.css" rel="stylesheet" type="text/css" />
<!--<![endif]-->
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<style type="text/css">
.style1 { width: 378px; }
</style>
</head>
Default.aspx
<asp:Content ID="Content5" ContentPlaceHolderID="head" Runat="Server">
<script type="text/javascript">
var height = screen.height;
document.getElementById('<%= hiddenLabel.ClientID%>').value = height;
</script>
</asp:Content>
Hello you can try with theses lines, you specific case is the third (clientHeight and clientWidth)
document.body.scrollWidth, document.body.scrollHeight // for the full size of the document
 
document.body.offsetWidth, document.body.offsetHeight //to the displayed size
 
document.body.clientWidth, document.body.clientHeight //customer for size displayed
Have you tried following?
<a href="javascript:alert
('Your resolution is ' + screen.width + 'x' + screen.height);">
Click for your screen resolution </a>

add background image to asp.net master web page asp.net 4.0 and html5

Using ASP.NET, C#, HTML5 and CSS3. My MasterPage is not recognizing the background image I have set in my stylesheet. I found an answer from 2009 on the ASP.NET forums from an MSN developer and it is still not working. After checking the code, the answer is relevant to XHTML transitional, the default doctype for .NET in Visual Studio.
Any suggestions? Thank you in advance.
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<link href="../changes.css" rel="stylesheet" type="text/css" />
<link href="../style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div id="PageWrapper">
html, body {
background-color: #000;
background-image: url('../images/darker_wood_1600x1200.jpg');
background-attachment: scroll;
background-repeat: repeat-x;
}
<!DOCTYPE html>
<html>
<meta charset="utf-8" />
<head><title>
</title>
<link href="changes.css" rel="stylesheet" type="text/css" /><link href="style.css" rel="stylesheet" type="text/css" /></head>
<body>
<form method="post" action="Default.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NDU2MTA1MmRkM1MGX8QufJ31wnSeINevDB81G3lHsitto4ucLAdg6zs=" />
</div>
<div id="PageWrapper">
<div id="Header"><a href="./">Header here
</a></div>
<div id="MenuWrapper">Menu here</div>
<div id="MainContent">
</div>
<div id="Sidebar">Sidebar here</div>
<div id="Footer">Footer here</div>
</div>
</form>
This code works for me, but I don't know if the code above is how it looks. Cause you post a stylesheet value in the middle of a div.
Also, if the page can't read the file. Try a different file or try changing the search path for the file. Maybe it can't read it because it's outside the server dir. Because the CSS code looks correct.
<!DOCTYPE html>
<html>
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<link href="../changes.css" rel="stylesheet" type="text/css" />
<link href="../style.css" rel="stylesheet" type="text/css" />
<link href="changes.css" rel="stylesheet" type="text/css" /><link href="style.css" rel="stylesheet" type="text/css" /></head>
<meta charset="utf-8" />
<style type="text/css">
// If you want the "Page" background to be this way:
html, body
{
background-color: #000;
background-image: url('../images/darker_wood_1600x1200.jpg');
background-attachment: scroll;
background-repeat: repeat-x;
}
// Or the PageWrapper
div#PageWrapper
{
background-color: #000;
background-image: url('../images/darker_wood_1600x1200.jpg');
background-attachment: scroll;
background-repeat: repeat-x;
}
</style>
</head>
<body>
<!--- <form id="form1" runat="server"> --->
<form method="post" action="Default.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NDU2MTA1MmRkM1MGX8QufJ31wnSeINevDB81G3lHsitto4ucLAdg6zs=" />
</div>
<div id="PageWrapper">
<div id="Header">
Header here
</div>
<div id="MenuWrapper">
Menu here
</div>
<div id="MainContent">
</div>
<div id="Sidebar">
Sidebar here
</div>
<div id="Footer">
Footer here
</div>
</div>
</form>
<!--- </form> --->
</body>
</html>

The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>)

I am stuck with this error and found a work around and the solutions works for me, but i i would like to know is it the best way to fix the issue and i want to make sure that it wont affect any other pages badly. Hope the experts will help.
If this was the best solution then many of you can save your heads.
This error occurs when a code block is placed in the MasterPage. Place the code block in a placeholder to resolve the issue.When adding AJAX extenders to your Web page, it will attempt to register scripts in the head. If code blocks are present in the MasterPage, an error might occur.
To resolve this issue, simply move the code block into a placeholder in the head of your MasterPage, like so:
<head id="Head1" runat="server">
<title>Untitled Page</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="myPlaceholder" runat="server">
<script language="javascript" type="text/javascript" src="<%= Page.ResolveClientURL("~/javascript/global.js")%>"></script>
</asp:ContentPlaceHolder>
<asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
</head>
The error is logical you can not confuse the rendered controls after they rendered by using the <%= %>
One way to solve this issue is to use a literal control, and render the script line on code behind.
<asp:ContentPlaceHolder ID="myPlaceholder" runat="server">
<asp:Literal runat="server" ID="txtIncludeScript" EnableViewState="false"></asp:Literal>
</asp:ContentPlaceHolder>
and on code behind. Check for null because if you change the placeholder the literal is null. Also set EnableViewState=false because you set it on every Page_Load and you do not wish to save it to viewstate.
if(txtIncludeScript != null)
{
txtIncludeScript.Text =
string.Format("<script language=\"javascript\" type=\"text/javascript\" src=\"{0}\"></script>",
Page.ResolveClientUrl("~/javascript/global.js"));
}
ContentPlaceHolder requires a master page, so you can replace that tag with some other element that can be ran at the server in case your page does not have a master page and you cannot get rid of the
<head id="Head1" runat="server">
<title>Untitled Page</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<div runat="server">
<script language="javascript" type="text/javascript" src="<%= Page.ResolveClientURL("~/javascript/global.js")%>"></script>
</div>
<asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
</head>

Problem with loading CSS while invoking page by Server.Transfer()

While I'm using Response.Redirect("~/Pages/Page.aspx"), style is loaded on the page, but unfortunately it is not loaded while I'm using Server.Transfer("~/Pages/Page.aspx") method.
The page looks following:
<html>
<head runat="server">
<link href="../Css/Layout/style.css" type="text/css" rel="stylesheet" />
</head>
<body></body>
</html>
How to make the page load style.css using Server.Transfer() ?
Regards
The problem is that you use a relative path to your CSS file, you should use an abolute path.
If the css folder is inside your application root, you can use
<html>
<head runat="server">
<link href="/Css/Layout/style.css" type="text/css" rel="stylesheet" />
</head>
<body></body>
</html>
or even
<html>
<head runat="server">
<link href="~/Css/Layout/style.css" type="text/css" rel="stylesheet" runat="server" ID="aUniqueId" />
</head>
<body></body>
</html>

Categories

Resources