Develop Reference

How to get panels/classes side by side in ASP.NET?

This is the problem I am having:
How my page looks on firefox
and How my page looks on chrome
What I want to do is get reserve form and data source forms side by side. I have already set a class using the fieldset method but can't figure out what to use to have it side by side.
Using this for data sources form
.tables
{
width:372px;
border-color:Black;
margin-left:150px;
height:500px;
}
and using this for Reserve Form
.mreg
{
width:372px;
border-color:Black;
margin-left:150px;
height:500px;
}
Just want two get the two forms side by side.
Edit -
Asp.net coding for Reserve Form:
<asp:Label ID="lblerrormsg" runat="server" Text="Error Message" Visible="False"></asp:Label>
<fieldset class="mreg">
<legend>Reserve </legend>
<asp:Label ID="Label2" runat="server" Text="Reserve ID" Font-Bold=true></asp:Label>
<br />
<asp:TextBox ID="txtRID" runat="server" Height="18px" Width="213px"></asp:TextBox>
<%--<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="txtLID" ErrorMessage="Loan ID Required"></asp:RequiredFieldValidator>--%>
<br />
<br />
<br />
</fieldset>
Coding for data source form:
fieldset class="tables">
<legend>Data Sources </legend>
<asp:Label ID="Label6" runat="server" Text="Reservation Table" Font-Bold=true></asp:Label>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
AutoGenerateDeleteButton="True"
DataKeyNames="Reservation_ID" DataSourceID="SqlDataSource1" BorderStyle="Dotted">
</asp:SqlDataSource>
</fieldset>
</asp:Content>
Is there anything wrong with the code?

You should give float:left to float to the left of screen and get side by side. Also it is not a good practice to give width as px as screen sizes vary.
.tables
{
width:48%;
border-color:Black;
float:left;
display:block;
height:500px;
}
.mreg
{
width:48%;
border-color:Black;
float:left;
display:block
height:500px;
}

You have multiple css options that you could use. As one:
float:left;
...will allow the divs to effectively "float" to the left side of their container, which will solve your problem. However, floats are problematic for a number of reasons, and there are often better options. For example, you can consider taking advantage of the "display" css property, such as:
display: inline-block;
This would also display your divs in a horizontal fashion, and tends to behave more consistently and with fewer problems. There are more options for the "display" property, though, which is worth looking into -- a good overview of some of the options can be found here:
float:left; vs display:inline; vs display:inline-block; vs display:table-cell;

How to set font size, family and colour of listview in ASP.NET (C#)

So I have the following ListView1
[asp.net]
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1"
onprerender="ListView1_PreRender"
onselectedindexchanged="ListView1_SelectedIndexChanged">
To which I have tried to set the following properties through CSS
[css]
#ListView1
{
color: White;
font-family: Calibri;
}
But that did not work for some reason.

You could set the ClientIdMode to static to ensure that the ID of the server control doesn't change when it is rendered as html even if it is in a container or a master page.
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1"
onprerender="ListView1_PreRender"
onselectedindexchanged="ListView1_SelectedIndexChanged" ClientIdMode="Static">

you can try the CssClass property
.ListView1
{
color: White;
font-family: Calibri;
}
and then use it as
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1"
onprerender="ListView1_PreRender" CssClass= "ListView1"
onselectedindexchanged="ListView1_SelectedIndexChanged">
You can style it more better if you use the ItemTemplate / LayoutTemplate as shown here

runat='server' will change element IDs often times, appending the name of the class of the page. You can do two things to fix the issue:
1) Change the name of the ID selector in CSS to match what the ID is altered to be (which you figure out by doing a view source on the rendered page).
2) Apply a class to the element instead of using the ID.
The second one is probably better, as you can reuse that class on other pages without changing any CSS, and it's a bit more straightforward.

Icon Not fit to Button Control in asp.net application

In my Asp project,..
I have used Icon file in Button. But those Icons not fit to Buttons. It half of the height only visible.
My Code is..
<asp:Button ID="btnCoverPlus" runat="server"
style="background-image: url('Images/plus.ico'); background-repeat:no-repeat; background-position:center; width:32%; font-size:medium;"
Height="25px" onclick="btnCoverPlus_Click" /> <br />
How to fit the Icons in ASP buttons?.

The obvious is to change the icon side, but you can also try to auto resize it with the style by adding :
background-size: 100% Auto;
or direct set the size
background-size: 16px 16px;
please note that only CSS 3 supports that.

try to increase button height by changing Height="25px property

Increase the width of TabContainer header

I have a vertical TabContainer, but I can't fix the width of the TabPanel (it will increase a little, but not to the full width of the text). Text is hidden behind the ContentTemplate. For example:
Here's the markup:
<asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0" Visible="false" UseVerticalStripPlacement="true">
<asp:TabPanel ID="TabPanel2" runat="server" >
<HeaderTemplate>
<div style="width: 200px">General Examination </div>
</HeaderTemplate>
<ContentTemplate> </ContentTemplate>
</asp:TabPanel>
How can I fix the width of the tabs to that they are all same? The second tab, "General Examination", is not fully visible.

You need to add some CSS for the tab headers. The style that applies to that element of the AJAX Control Toolkit TabContainer is named .ajax__tab_header_verticalleft. Something like this should work:
.ajax__tab_header_verticalleft
{
width: 200px;
}
You might be able to dial back a bit from 200px, but that should work for you.

Hope this may help anyone else facing the same problem.
provide VerticalStripWidth="150px" in asp:TabContainer

How to make Dropdown List with checkboxes?

How do we make a drop down list with checkboxes? C# lang is preferred for this.

You can't. Not a real one anyway, but you can fake one by making a scrolling div which appears when you click a button (using JQuery):
<div id="cbListDiv" style="height: 172px; width:300px; overflow-y:scroll; border:1px solid silver; margin-top:8px;">
<asp:CheckBoxList id="cbList" runat="server" RepeatLayout="Flow" />
</div>
Then you'd need to add some code to display or expand that region when you click a link on the page. That's about as close as you can get I think.