I have a below html code in my aspx page. I want to set the table width to 100% and it doesn't seems to work. Am I doing wrong anywhere?
<table style="width:100%">
<tr>
<td height="15">
<div id="menu">
<ul>
//page menus are being placed here
</ul>
</div>
</td>
</tr>
</table>
Also I have a grid below this table. The gridview stretches to right, but this table doesn't equally come with the gridview.
Make sure you have a proper html document:
<!doctype html>
<html>
<head>
<title>Test</title>
<style>
*{margin:0;padding:0;}//clear default browser margin & padding from all elements
html,body{width:100%;position:relative;}
</style>
</head>
<body>
<table style="width:100%">
<tr>
<td height="15">
<div id="menu">
<ul>
//page menus are being placed here
</ul>
</div>
</td>
</tr>
</table>
</body>
</html>
EDIT:
The tag does not have any CSS rules automatically applied to it. But the tag has default margins on all browsers, so all you need to do is shave them off by using the following CSS:
body {
margin: 0px;
}
Click the Run code snippet button below to check it.
body {
margin: 0px;
}
<table style="width:100%; border:1px solid black;">
<tr>
<td height="15">
<div id="menu">
<ul>
//page menus are being placed here
</ul>
</div>
</td>
</tr>
</table>
Related
I am using to Gembox.Document to convert HTML to PDF. This is my HTML:
<div style="border-top:5px solid black;border-left:5px solid black;padding:2px 15px;font-size:18px;font-weight:bold;line-height:22px; background-color:aquamarine;width:230px">
Test
</div>
But in PDF, the border is lost.
Do you know how to fix this problem?
Edit: I add sample code: (test HTML link: https://www.gemboxsoftware.com/document/examples/c-sharp-convert-html-to-pdf/307)
<!DOCTYPE html>
<html>
<body>
<table style="width:100%;" cellpadding="0" cellspacing="0">
<tr>
<td style="width:50%;">
<div style="border-top:5px solid black;border-left:5px solid black;padding:2px 15px;font-size:18px;font-weight:bold;line-height:22px; background-color:aquamarine;width:230px">
Test
</div>
</td>
<td style="width:50%;font-size:18px;font-weight:bold;line-height:22px;">Number</td>
</tr>
</table>
<div style="border-top:5px solid black;border-left:5px solid black;padding:2px 15px;font-size:18px;font-weight:bold;line-height:22px; background-color:aquamarine;width:230px">
Test
</div>
</body>
</html>
Edit 2: I found out a solution to fix, it is really not beautiful but at least it worked for me
<table style="width:100%;" cellpadding="0" cellspacing="0">
<tr>
<td style="width:50%;">
<table style="width:150px;margin:0px" cellpadding="0" cellspacing="0">
<tr>
<td style="border-top:1px solid black;border-left:1px solid black;">
<div style="padding:2px 15px;font-size:18px;font-weight:bold;line-height:22px;">
Test
</div>
</td>
</tr>
</table>
</td>
<td style="width:50%;font-size:18px;font-weight:bold;line-height:22px;">Number</td>
</tr>
</table>
What version are you using? Perhaps you should try again with the current latest bugfix version, from here.
I tried converting this HTML:
And I get this PDF:
As you may notice, the top and left borders are there. Also, all other CSS except "width" are there.
Last, I also tried "display" and "visibility" and it seems that both work.
I am not able to display the anchor tag inside the AngularJS expression. The problem is that when I am trying to display an anchor tag as an icon which is being fetched from the API, it's only displaying the raw path as
a href='../UserControls/DownloadRLCSFile.ashx?Path=\\dotnetdev\csv\RLCSDocuments\Registrations\ABACF\E.S.I.C. Registration\Sample.xlsx' target='_blank' download><i class='fa fa-download' style='font-size: 13pt;' ></i></a>
Please find the below code:
<div id="Div2" ng-controller="BasicRegulatoryDetail">
<h4 class="padder-sm b-b"><b>Regulatory Updates</b></h4>
<div>
<div class="table-responsive">
<table class="table table-striped bg-white ">
<tbody>
<tr ng-repeat="bs in BasicInfo" >
<td><asp:HyperLink ID="HyperLink1" NavigateUrl="~/RLCS_Connect/RegulatoryUpdateDetails.aspx?Subject={{bs.Subject}}" runat="server">{{bs.Subject}}</asp:HyperLink></td>
<td>{{bs.Document_Path}}</td> //here i am facing the problem
</tr>
</tbody>
</table>
</div>
</div>
</div>
Sounds like you might need ng-href:
https://docs.angularjs.org/api/ng/directive/ngHref
The wrong way to write it:
link1
The correct way to write it:
<a ng-href="http://www.gravatar.com/avatar/{{hash}}">link1</a>
I'm trying to figure out how to center this table without taking into account the third column, which is for data validation. I have it rendering exactly how I want it now with the display none attributes on the third column but then my error text won't show. What is the simplest way to go about this? Thanks!
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="budgetTracker.Login" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Login Page</title>
<link rel="stylesheet" type="text/css" href="content/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="content/custom.css" />
</head>
<body>
<form id="form1" runat="server">
<div class="container center">
<div class="center">
<div class="vert">
<table style="margin-left: auto; margin-right: auto;">
<tr>
<td colspan="2">
<h1>Budget Tracker Login</h1>
</td>
</tr>
<tr>
<td>
<asp:Label ID="userNamelbl" runat="server" Text="User Name"></asp:Label></td>
<td>
<asp:TextBox ID="userNameBox" class="form-control" runat="server"></asp:TextBox></td>
<td style="display: none;">
<asp:RequiredFieldValidator ID="userNameRequired" runat="server" ErrorMessage="Username is Required" ControlToValidate="userNameBox" ForeColor="Red"></asp:RequiredFieldValidator></td>
</tr>
<tr>
<td>
<asp:Label ID="passwordlbl" runat="server" Text="Password"></asp:Label></td>
<td>
<asp:TextBox ID="passwordBox" class="form-control" runat="server" TextMode="Password"></asp:TextBox></td>
<td style="display: none;">
<asp:RequiredFieldValidator ID="passwordRequired" runat="server" ErrorMessage="Password is Required" ControlToValidate="passwordBox" ForeColor="Red"></asp:RequiredFieldValidator></td>
</tr>
<tr>
<td colspan="2">
<asp:Button ID="Button1" runat="server" class="btn btn-primary btn-space" Text="Login" OnClick="loginButton_Click" /></td>
</tr>
<tr>
<td colspan="2">Not yet a member? Click HERE to register!</td>
</tr>
</table>
</div>
</div>
</div>
</form>
</body>
</html>
Marco is right, table should be used for tabular data not for layout.
To answer your question, you can remove the "display: none;" in your td tag.
Add a label control for your error message (I'd call it "ErrorLabel") then add this code on in your "error area" (that would be inside your loginButton_Click method)
ErrorLabel.Visible = true;
In your PageLoad, add this:
if (!IsPostBack){
ErrorLabel.Visible = false;
}
I want to save information from a webpage. The user selects a frequency (530 to 1700) from a drop-down and then submits and gets a list back for that frequency. I want to loop through each value, run the query, and (after some parsing and clean-up) save the results to a file. Would prefer to do it in a C# app, but VB or Java are OK, too. I've found a number of ways to get and save the original form page. But nothing about how I can take that page in code and then submit against it to get results back. Here's the link I'm trying to query and a stripped-down look at the HTML.
http://www.topazdesigns.com/ambc/amsearch96a.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link type="text/css" href="aminfo.css" rel="STYLESHEET">
<title>AM Station Search</title>
</head>
<form action="/cgi-bin/amsearch96a.pl" method="post" target="amoutput">
<table style="background-color: rgb(135, 206, 250); width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0">
<tbody>
<tr>
<td><b>AM Frequency:
<select size="1" name="freq">
<option>530
</option>
<! etc X 10>
<option selected="selected">1200
</option>
<! etc X 10>
<option>1700
</option>
</select>
</b> </td>
<td align="right"><input value="Show All Stations" name="B4" class="button" type="submit"> </td>
</tr>
</tbody>
</table>
</tbody>
<table style="background-color: rgb(135, 206, 250); width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0">
<tbody>
<tr>
<td style="text-align: left;">Include power/antenna info: <input checked="checked" name="pwrant" value="on" type="checkbox"></td>
<td style="text-align: right;">Include low power (<100W) stations: <input name="lowpwr" value="on" type="checkbox"></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
I have a default _siteLayout.cshtml file with a call to #RenderBody() in the centre of it, in between some markup and Razor code.
I have a complex .aspx page which has some markup that I wish to render where this call to #RenderBody() is made.
Essentially, I would like to make a call like this inside of a new file :
#{
Layout = "/Shared/_SiteLayout.cshtml";
#RenderPage(Default.aspx);
}
However, it is not possible to make a call to a .aspx page in this case.
Is there any simple solution to this ?
Default.aspx :
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="fullcalendar/fullcalendar.css" rel="stylesheet" type="text/css" />
<link href="Styles/dark-hive/jquery.ui.all.css" rel="stylesheet" type="text/css" >
<link href="Styles/jquery-ui-1.7.3.custom.css" rel="stylesheet" type="text/css" />
<link rel='stylesheet' type='text/css' href='fullcalendar/fullcalendar.print.css' media='print' />
<script src="jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="jquery/jquery-ui-1.7.3.custom.min.js" type="text/javascript"></script>
<script src="jquery/jquery.qtip-1.0.0-rc3.min.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true">
</asp:ScriptManager>
<div id="updatedialog" style="font: 70% 'Trebuchet MS', sans-serif; margin: 50px;"
title="Update or Delete Event">
<table cellpadding="0" class="style1">
<tr>
<td class="alignRight">
Name:</td>
<td class="alignLeft">
<input id="eventName" type="text" /><br /></td>
</tr>
<tr>
<td class="alignRight">
Description:</td>
<td class="alignLeft">
<textarea id="eventDesc" cols="30" rows="3" ></textarea></td>
</tr>
<tr>
<td class="alignRight">
Start Time:</td>
<td class="alignLeft">
<span id="eventStart"></span></td>
</tr>
<tr>
<td class="alignRight">
End Time: </td>
<td class="alignLeft">
<span id="eventEnd"></span><input type="hidden" id="eventId" /></td>
</tr>
</table>
</div>
<div id="addDialog" style="font: 70% 'Trebuchet MS', sans-serif; margin: 50px;" title="Add Event">
<table cellpadding="0" class="style1">
<tr>
<td class="alignRight">
Name:</td>
<td class="alignLeft">
<input id="addEventName" type="text" size="50" /><br /></td>
</tr>
<tr>
<td class="alignRight">
Description:</td>
<td class="alignLeft">
<textarea id="addEventDesc" cols="30" rows="3" ></textarea></td>
</tr>
<tr>
<td class="alignRight">
Start Time:</td>
<td class="alignLeft">
<span id="addEventStartDate" ></span></td>
</tr>
<tr>
<td class="alignRight">
End Time:</td>
<td class="alignLeft">
<span id="addEventEndDate" ></span></td>
</tr>
</table>
</div>
<div runat="server" id="jsonDiv" />
<input type="hidden" id="hdClient" runat="server" />
</form>
</body>
</html>
You could externalize the sections that you want to reuse from this .aspx page into .ascx partials and then render them:
#{
Layout = "/Shared/_SiteLayout.cshtml";
}
<div>
#Html.Partial("foo.ascx")
</div>
some other contents
And if you want to use a WebForms view with a Razor Layout, I am afraid that it's not possible. The contrary though is possible: using a Razor view with a WebForms masterpage.
The simplest solution - render that page in an iFrame from within a partial view. Its an option but in general, bad practice in cases like this (see: Are iframes considered 'bad practice'?)
The right way to handle this is to break up that aspx into modules you can use - as Darin responded with.