.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
Sign In
Register
 
Win Surprise Gifts!!!
Congratulations!!!


Top 5 Contributors of the Month
Kaviya Balasubramanian
Sgraph Infotech
Imran Ghani
Post New Web Links

Align spans vertically and horizontally inside a div

Posted By:      Posted Date: August 27, 2010    Points: 0   Category :ASP.Net
 

Hi,

This question is not really about ASP.Net, but since almost all ASP.Net developers know css, I am sure someone will have answer. I have the following html and inline css:

<div id="container" style="height: 34px; width: 100%; border:1px solid #333">
<span id="largeText" style="font-size: 22px">Large text</span>
<span id="smallText" style="font-size: 12px">Small text</span>
</div>

I want to
(1) Vertically align both largeText and smallText in container div
(2) Horizontally largeText will be attached to the left border of container div  and smallText will be attached to the right.

Please help




View Complete Post


More Related Resource Links

Centering an img in a div both horizontally and vertically

  

I realize this is simply an HTML question, but I'm having a difficult figuring out the CSS stuff to center an <img /> tag within a <div> tag.

<div style="width: 180px; height: 180px; padding: 10px; margin-top: auto; margin-bottom: auto;">
  <img src="file" alt="" style="width: 160px; height: 80px;" />
</div>

It centers horizontally just fine, but I cannot get it to center vertically within the div.

Can anyone point out what I'm missing???


Image stretch inside a grid stops working horizontally once columns are added to grid.

  
I have a simple setup of a window. Window contains a grid, inside the grid there is an image. I want the image to always stretch across the entire cell. I've set it's Stretch property to Fill and it works fine, as long there is only one column in the parent grid. As the window is resized, the image stretches correctly. As soon as I add another column, the image stops stretching horizontally. Vertially it works just like before, horizontally it now appears with a fixed width corresponding to the width of the picture used as the source. Does not matter which column it's positioned in, and I've tried encapsulating it into another grid but behaviour does not change. It behaves the same in both Visual studio 2010 designer and at runtime. In addition when I tried to encapsulate it in a second grid, this seond grid also now has altered behavior - instead of sizing itself to it's container (both height and width are not set) as it's parent grid does, it now sizes itself to its contents - the image. But only horizontally. What is going wrong here, is this a bug or am I missing something, and any advice on how I can get the image to fill one of the cells of a grid with more then one column?

CheckBox text align vertically middle

  

Hi all,


How to make the CheckBox text align vertically middle


Thanks,

Babu Kumarasamy.




Accessing the different controls inside a GridView control

  
how we can access a particular control which resides inside a GridView control. In this article I will show you how you can access different controls inside a GridView control. We will see how we can access a TextBox control, a DropDownList control and a ListBox control. If you are working with ASP.NET 1.X then you might want to check out my article Accessing Different Controls Inside a DataGrid.

How To Add calendar control inside a GridView

  
This article show hot to add calendar control inside a GridView with code in c#

Using ATLAS PopUp Control with Calendar inside the GridView Control

  
In this video tutorial Mohammad demonstrates how you can access the Calendar control which is displayed using the ATLAS PopUp control inside the GridView control.

RadioButton inside GridView, How to get it work as normal

  
Did you tried before to drag a RadioButton control inside a Gridivew templatefield, and then you attempt to select these RadioButtons , you will notice that the behavior of RadioButton control will be changed and it will work just like the behavior of checkbox control! the user will be able to select more than one radiobutton in the grid!

Maintain HTML Radio Button Selection Inside GridView After Postback

  
Long time ago I wrote an article about getting the value of the selected RadioButtons inside the GridView control. The code did not addresssed the postback issue which means that the selected radio button was cleared after the postback occurs.

LinkButton inside Repeater

  

Hi.

I have Repeater, which consists of LinkButon and Literal. LinkButon and Literal are whole thing by implication. I want get value from Literal, when user click on corresponding LinkButton.

TIA 


Textbox in ItemTemplate inside Gridview, unable to get the value

  

Hi. I have a itemtemplate inside a gridview.

<asp:TemplateField HeaderText="Enter OTP">
                        <ItemTemplate>
                            <asp:Label ID="Label2" runat="server"
                                style="font-family: Arial, Helvetica, sans-serif; font-size: x-small"
                                Text="PIN Num:"></asp:Label>
                            &nbsp;<asp:TextBox ID="txtPIN" runat="server" Height="21px" Width="100px"></asp:TextBox>
          &

Embed Youtube inside Ajax Html Editor- problem

  

Hi,

When inserting a simple embed of youtube inside the ajax editor, on firefox and chrome problems occur. On the other hand on internet explorer 8 everything works fine. I found this solution http://www.nopcommerce.com/boards/t/4228/bug-in-ajax-html-editor.aspx . 

My question is where do I find the DesignPanel.pre.js ?


Thanks,

Roderick Vella


Gridview inside updatepanel

  

I am displaying large amount of data in gridview,the gridview placed within updatepanel,every 1sec i am refreshing updatepanel using ajax timer.my problem is while displaying large data the cpu performance is low,pls give idea to increase cpu performance..


how to get an array of all the asp.net textbox control inside create user wizard control?

  

Hi,

How can I get all the textboxes inside a create user wizard control using getElementsByTagName().

Below is my JQuery code:

<script type="text/javascript">
        function addLoadEvent(func) {
            var oldonload = window.onload;
            if (typeof window.onload != 'function') {
                window.onload = func;
            } else {
                window.onload = function() {
                    oldonload();
                    func();
                }
            }
        }


        function prepareInputsForHints() {
            var inputs = document.getElementsByTagName("asp:TextBox");
            for (var i = 0; i < inputs.length; i++) {
                inputs[i].onfocus = function() {
                    this.parentNode.getElementsByTagName("span")[0].style.display = "inline";
                }
                inputs[i].onblur = function() {
                    this.parentNode.getElementsByTagName("span")[0].style.display = "none";
                }
            }
        }
        addLoadEvent(prepareInputsForHints);

    </script>


 

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
       

find a Control inside a GridView using jQuery

  

I have databound GridView in my page and I have a hidden DIV in all rows. Each row contains a Button that I want it to make the DIV visible for me! how can I use that with jQuery?!


here is the code page: 


<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" 
                                EnableModelValidation="True" GridLines="None" ShowHeader="False" Width="100%">
                                <Columns>
                                    <asp:T

form feild hints are not displaying for textboxses inside create user wizard?

  

Hi,

I'm using following JS code to display input hint box besides the textbox whenever that asp.net textbox receives focus. 

I'm doing this for a registration form and all of the textboxes are inside the asp.net create user wizard control.

<script type="text/javascript">
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

function prepareInputsForHints() {
	var inputs = document.getElementsByTagName("TextBox");
	for (var i=0; i<inputs.length; i++){
		// test to see if the hint span exists first
		if (inputs[i].parentNode.getElementsByTagName("span")[0]) {
			// the span exists!  on focus, show the hint
			inputs[i].onfocus = function () {
				this.parentNode.getElementsByTagName("span")[0].style.display = "inline";
			}
			// when the cursor moves away from the field, hide the hint
			inputs[i].onblur = function () {
				this.parentNode.getElementsByTagName("span")[0].style.display = "none";
			}
		}
	}
addLoadEvent(prepareInputsForHints);
</script>
span.

unable to access control inside webuser control

  

hi

I have used calender web user control inside my project where i took textbox,button and calender.....but after dragging onto my aspx page....i am unable to access this textbox,calender and button on aspx page...Pls help me to find out the solution.


image inside custom server control

  

Hi,

I want to use an image inside a Custom Web server control ! 

Do I need to use Web.resources ? if so , how to do ?


Categories: 
ASP.NetWindows Application  .NET Framework  C#  VB.Net  ADO.Net  
Sql Server  SharePoint  Silverlight  Others  All   

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend