This seems to be similar to this post but I've tried the suggestions there (except for the custom helper) and it hasn't helped.
I'm trying to create a row of images in Razor so that there is no space/gap between them. My Razor view code looks like this. Model is an int.
string theNumber = String.Format( "{0:00000}", Model );
foreach( char theChar in theNumber.ToCharArray() )
{
<img src="/images/odometer/@{@theChar}.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
}
This is producing HTML that looks like the following.
<img src="/images/odometer/0.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/0.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/1.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/9.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
<img src="/images/odometer/7.gif" style="border-width: 0px;height: 20px;width: 15px;" alt="" />
Which results in the following displaying in the browser.
The line breaks in the HTML source are causing gaps between the images. What I really want is the HTML to be generated all on one long line, like this.
<img src="images/odometer/0.gif" style="border-width:0px;height:20px开发者_开发知识库;width:15px;" /><img src="images/odometer/0.gif" style="border-width:0px;height:20px;width:15px;" /><img src="images/odometer/1.gif" style="border-width:0px;height:20px;width:15px;" /><img src="images/odometer/9.gif" style="border-width:0px;height:20px;width:15px;" /><img src="images/odometer/7.gif" style="border-width:0px;height:20px;width:15px;" />
Which would result in an image like.
I know one option would be to not use a loop. My number will always be five digits, so rather than looping over each character in the string I could simply write an img tag for each digit.
I believe this works:
@{
var htmlTemplate = "<img src=\"/images/odometer/{0}.gif\" style=\"border-width: 0px;height: 20px;width: 15px;\" alt=\"\" />";
string theNumber = String.Format("{0:00000}", DateTime.Now);
}
@foreach (char theChar in theNumber.ToCharArray())
{
@Html.Raw(string.Format(htmlTemplate, theChar))
}
HTH
If there is a fixed number of digits and rendering is an issue, I'd either drop the foreach
or try writing the whole statement on the same line.
精彩评论