Let's say I have a variable cssStyles which contains some css as String. I want to send it in my html file in this way
<style>
${cssStyles}
</style>
How can this be achieved with thymeleaf?
Thanks!
At the very least you need to mark the style object that you'r using inline thymeleaf and use proper inline syntax. Below a mock of what I think might work.
See https://www.thymeleaf.org/doc/tutorials/2.1/usingthymeleaf.html#inlining for more information on how to do thymeleaf inlining
<style th:inline="text">
[(${cssStyles})]
</style>
what means ${demo.css} in example files of highcharts ? That piece of code
<style type="text/css">
${demo.css}
</style>
seems to be literal
This looks like a jQuery template tag to load a non-existent CSS file. According to this Highcharts form post it is not required, and all configuration should be managed through Javascript rather than CSS.
The Highcharts API Reference lists all of the Javascript configuration items.
I have made my own stylesheet that I require to include on the Jenkins plugin.
<l:layout css="/plugin/myPlugin/css/jquery-ui.css">
<link rel="stylesheet" href="${rootURL}/plugin/myPlugin/jquery-ui.css" type="text/css" media="screen" />
Please advice me..
Thanks..
To link CSS files in Jelly files is deprecated, see jelly tags documentation:
This was originally added to allow plugins to load their stylesheets, but the use of thie
attribute is discouraged now. plugins should now do so by inserting <style> elements
and/or <script> elements in <l:header/> tag.
Please use inline css tags instead (code example).
Place your css file(s) under
/src/webapp/css
and reference them as ..
" href="${rootURL}/plugin//css/layout.css"
Using a <link> element with the $rootURL as noted above worked for me. The important thing that I noticed was to make sure to place the <link> element after <l:layout>. I had it right after the <j:jelly> tag originally and it wasn't able to render the ${rootURL}.
The <link> tag will be much cleaner than doing inline styling.
I'm developing an app in ASP.Net MVC4 and am having a strange issue with whitespace. I've developed plenty of MVC3 sites with Razor without this issue.
Here's my template cshtml file:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>HF - Content Management - #ViewBag.Title</title>
<link href="#Url.Content("~/content/bootstrap/bootstrap.min.css")" rel="stylesheet" />
#Styles.Render("~/bundles/css/hf-cms-logged-in")
</head>
<body>
#Html.Partial("Partials/NavBar")
<div class="container">#RenderBody()</div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="#Url.Content("~/scripts/bootstrap/bootstrap.min.js")"></script>
#Scripts.Render("~/bundles/js/validation")
<script src="#Url.Content("~/scripts/hf-cms.js")"></script>
</body>
</html>
Note the line with the RenderBody() call - there's no extraneous whitespace here.
When I call an action, the rendered body is prepended with some whitespace which I can't see that I've added, and can't seem to get rid of. I call an action with no logic, it only returns the following view:
#{
ViewBag.Title = "Dashboard";
}
<h1>Dashboard</h1>
It's definitely using the correct template (specified in my _ViewStart.cshtml)
Viewing the page in Google Chrome, the source shows extra whitespace. See the image below:
A similar issue can be seen in IE10. This is obviously affecting the design. I've tried using Meleze.Web to strip out any extra whitespace, but whitespace still remains.
I'm at a loss with this one, as it's a relatively simple site so far, there's nothing funky going on yet, so I can't see where this whitespace is coming from.
Has anybody else seen this with MVC4 or Razor before?
Edit: I've tried removing all stylesheets and script files, the whitespace still exists.
After struggling with this for a while, I've found the solution.
There must have been a funny character in the root _ViewStart.cshtml file. I deleted the contents of the ViewStart file and retyped it, which solved the problem. This got me thinking that a strange character could be causing the issue.
Don't like answering my own question, but I hope this helps somebody else. In theory, this won't be an MVC4-specific issue, you could encounter the same problem in MVC3.
I encountered the same problem, and Steve's answer put me on the right track, that it might be an unusual character embedded in the file.
In my case, it turned out to be a duplicate Unicode Byte-Order Mark (0xEFBBBF) at the start of the file. It seems to have snuck in when I copied and pasted the file contents in from a Git Extensions diff view.
Incidentally, Visual Studio has a built-in Hex viewer. If you right-click on a file in the Solution Explorer and click "Open With..." you can select "Binary Editor".
I have been experiencing the same problem, and tried the approach you put forth, Steve. However, that didn't solve my problem. What I found was involved in causing the problem was the h2 tag at the top of my child page:
<h2>#ViewData("Title")</h2>
When I removed the wrapping tags, everything worked fine:
#ViewData
As a test, I took the styles for the h2 and placed them in their own class and then wrapped my page title content with a span:
<span class="pagetitle">#ViewData("Title")</span>
This worked fine, so is how I corrected the problem with my site. Though I don't know the true root cause, this did fix my problem, so perhaps it will help someone else out there.
I've just experienced a similar problem - in my case, one of the #using directives at the top of the view was causing an issue. I found the same thing in a couple of different views in my project.
One thing that helped me to locate the offending characters was pasting the whole view's contents into Notepad - it was immediately clear that the lines in question had somehow been encoded differently (they appeared smaller than the other lines, even in Notepad). Deleting the lines and rewriting them from scratch solved the issue, though I'm sadly none the wiser how I got into that position in the first place...
I have had the same issue and thanks to the clues here I was able to identify the problem.
After a lot of investigation I figured out that there was a Unicode character ‘zero width no-break space’ at the start of the page. This character is added to a page when it is saved/encoded as ‘UTF-8 with BOM’. I can only guess that the page was edited outside of visual studio, copied in from somewhere else, or maybe the page encoding was set incorrectly in VS. You stated in other answers you can see it by the looking at the once copied and pasted into notepad.
I faced the same problem, and I fixed it as follwoing:
- change column (Field) datatype in your database from nchar to nvarchar.
this is because nchar reserve fixed length, hence if your string is shorter than this length it will complete it with spaces.
I had a similar problem, but a much more obvious solution. I had an Html.Partial() inclusion in my <head> element with an ; after the method call. Which again is rendered in the body.
<head>
#await Html.PartialAsync("Test"); // The ";" is rendered in the body, remove it!
</head>
<body>
...
</body>
I have seen at couple of places people using the inside the tag to include the css, like below
<link href="<s:url value="path_to_css_file" />" rel="stylesheet" />
What are we gaining from this. We could have easily written the same code without the and things would have worked then also.
It uses the application context (similar to the JSTL tag), but has S2-specific attributes like action, can include/not include current request parameters, etc. (tag docs)
If you're not using any S2-specific functionality when you're using it, I'd use the JSTL equivalent.
I don't really know what will be the difference. All I do know it has something to do with 'struts' and apache.
Hope the source might help you put.
Source: http://struts.apache.org/2.0.11/docs/url.html