When I'm adding css classes or changing bootstrap classes on view html in ASP.NET MVC, nothing happens.
CSS stylesheet
.icon {
margin-top: 8px;
border: 1px solid white;
border-radius: 100%;
}
.titleLibrary{
color: gray;
}
View html
<a href="#Url.Action("Index","Home")">
<img src="#Url.Content("~/Icons/bookIcon.jpg")" width="50" class="icon" />
</a>
#Html.ActionLink("Library", "Index", "Home", new { area = "" }, new { #class = "titleLibrary" })
screenshot
but when I use style in html everything is fine
<a href="#Url.Action("Index","Home")">
<img src="#Url.Content("~/Icons/bookIcon.jpg")" width="50" style=" border: 1px solid white; border-radius: 100%;" />
</a>
If you are not clearing the cache, then this may be a reason for not reflecting the updated CSS style in your Index or any other page. So try to clear the cache and then try to update the style. For clearing cache use Ctrl+F5. This will helps to clear the cache. The another solution, if you are keeping the style.css file separately, then please give the reference link at the top the Index page, then refresh and rebuild the page and try again.
<head>
<link href="~/Content/background.css" rel="stylesheet" />
</head>
Hey Ivan have you made sure to render your styles on your view you are using? For instance if you are using a layout page you usually would render your style bundle or sheet at the head of the layout page.
I'll give you an example
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Project System</title>
#Styles.Render("~/content/site-bundle")
#RenderSection("styles", false)
</head>
Here you can see me render my style bundle. In this case you can instead render your stylesheet you have.
Make sure, If that css file is in the same directory (or folder) as the html page, it's as easy as typing in "style.css" with the name of the css file matching whatever you called yours. I just used style.css to simplify things. However, if the css file is in another directory (say inside a folder called css) you would need to type out the path to it relative to the html document. In this case, you'd type "css/style.css". Generally, it's a good idea to store your css files in a css folder.
<head>
<title>My Page</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
After compiling the entire asp.net project, when the first time the default.aspx page loads, asp.net compiles the pages into Temporary Asp.Net directory. This takes a long time during which I want to show a loading gif to the user.
Using a javascript on the default.aspx does not work as the page is practically not constructed yet. To get around this I created another page, say startup.html, that loads the splash and loads the default.aspx using windows.location.replace function.
This works but seems kludgy, Is there a better way of doing this?
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.load {
width: 100%;
height: 100%;
position: fixed;
z-index: 9999;
background: url("images/loading.gif") no-repeat center center rgba(0,0,0,0.25);
}
</style>
<script type="text/javascript" async>
setTimeout(function () {
window.location.replace("default.aspx");
}, 100);
</script>
</head>
<body>
<div class="load" />
</body>
</html>
<html>
<body style='margin: 0; padding: 0 50px; font-size: 12px;'>
<div style='page-break-after: always;'>
<h1>H1</h1>
</div>
<div>
<h2>H2</h2>
</div>
</body>
</html>
I can't use page break in HTML format which will be made into PDF, I've tried various ways but the results don't change, when I use the br tag it works but when entering the style page break it doesn't work.
I want to split the page between h1 and h2
I'm sending an html formatted responsive email to my clients after they sign up from my .net MVC app. My problem is that the picture which in this case is my logo doesn't get centered no matter what css or bootstrap class I apply to it. It looks fine when rendering on a computer or even in another different mail client on ios. The problem seems to be the default mail app. Here is how it is showing. The first picture is how it appears on the mail app and the second picture is how it appears on a desktop which displays correctly. Please note that the white text is the picture. The purple background is just a div that I made purple.
Here is my code:
<!DOCTYPE html>
<html>
<head>
<meta name=viewport content="width=device-width, initial-scale=1">
<title>Welcome To Church Musician!</title>
<style>
.header {
background-color: darkviolet;
height: 200px;
max-width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.container{
background-color: white !important;
}
body{
background-color: whitesmoke !important;
}
</style>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
<div class="container" >
<div class="header">
<img class="img-fluid"src="cid:id1" />
</div>
<hr />
<p>This is a test</p>
</div>
</body>
</html>
I'm developing a mapping application (VS2008 C#) and have my map window (Esri ADF MapControl) displayed within my main aspx.
I'm now compiling a print template with another aspx page which will display and print the current map from the main aspx.
Normally I'd use a Frame tag to dispay the main aspx in my print template however I'm just interested in copying over the map DIV.
You can try do it using jquery:
<!DOCTYPE html>
<html>
<head>
<style>
body{ font-size: 12px; font-family: Arial; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<b>Footer navigation:</b>
<div id="mydiv"></div>
<script>
$("#mydiv").load("mypage.html");
</script>
</body>
</html>
Source: http://api.jquery.com/load/