Tips for aligning the loginStatus login screen in the center

Having an issue centering the login control that appears after selecting login using the loginstatus control.

<div id="linkContent">
    <asp:LoginStatus ID="LoginStatus2" runat="server" 
        LogoutAction="RedirectToLoginPage" />
</div>

Tried various methods found on Google, but none seem to be working. Using IE 9.

Attempted:

#linkContent
{
text-align: center;
}

Also tried:

<div id="linkContent">
    <asp:LoginStatus ID="LoginStatus2" runat="server" 
        LogoutAction="RedirectToLoginPage" style="text-align: center;" />
</div>

Additionally attempted:

#linkContent
{
margin-left:auto;
margin-right:auto;
}

Even redirected login to my own Login.aspx, but still no luck:

In webconfig:

<authentication mode="Forms" >
    <forms loginUrl="Login.aspx" />
</authentication>

None of these solutions have proven successful. The login control remains left aligned. The loginStatus control is utilized within a master page.

Any assistance would be greatly appreciated.

Thank you.

Answer №1

If you're looking to enhance your website's design, consider moving inline styles to your CSS file:

<div style="width: 700px; margin: 0 auto;">
    <asp:LoginStatus ID="LoginStatus3" runat="server" LogoutAction="RedirectToLoginPage" />
</div>

Ensure to adjust the width value to fit your control perfectly.

Answer №2

To center the LoginStatus control, you should apply the CSS properties margin-left: auto and margin-right: auto; directly to the generated markup of the control, not its containing element.

Assuming you have set ClientIDMode="Static" in your web.config, and that the resulting HTML will include an id of LoginStatus2 for the login static control, use the following CSS code:

#LoginStatus2
{
    margin-left:auto;
    margin-right:auto;
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Whenever attempting to utilize my login button in Swift, I often find myself having to press it twice in order for it to successfully connect with the mySQL

I'm in the process of developing an application that requires users to log in and register. When a user successfully registers, their account information is stored in my MySQL database. However, when I try to test the login feature, I encounter an iss ...

Adjust the font color of the progress bar dynamically based on the background color using SCSS and HTML

I am currently working on a progress bar that displays the percentage of delivery completed. While I have successfully designed the progress bar itself, I am struggling to change the text font color based on the background color of the bar. <div class=& ...

Could my mental model be flawed? When a page is accessed using https, a relative css path will be invoked using the same protocol

When your page is accessed using the https protocol, any relative path to an external CSS file will also be called using the https protocol. Do you really need to encrypt/decrypt CSS content? :D However, if you use an absolute path to reference an external ...

When implementing Critical CSS, the Jquery function fails to execute upon loading

Currently, I am working on optimizing my website at . In an attempt to improve its performance, I decided to implement critical CSS using penthouse. The Critical CSS code can be found here, generously provided by the main developer of penthouse. However, ...

Required .NET classes for parsing JSON data from a string

Similar Question: How to Parse JSON in C# In my ASP.NET web application (version 4.5), I am attempting to deserialize a JSON string from openlibrary.org using JSON.NET. The goal is to extract five properties from the JSON and store them in a single . ...

Is it possible to alter preact-material-components to switch to mdc-theme--dark mode, thereby changing the CSS style of all descendant components?

I recently created a preact-cli app and added the following code in Header.js: document.body.classList.add('mdc-theme--dark'); However, when a user tries to switch from the light theme to the dark theme, only the background of the app changes. ...

Error Encountered When Using ISNULL Function in UPDATE Query

As someone new to coding, please bear with me for any misuse of terms and lack of understanding. The issue with the ISNULL in the update query may not be the root cause of the problem, given my limited experience in this area. My current project involves ...

Display a Datagrid table featuring numerous column headers across multiple pages using asp.net

Unable to provide more details on the title, please refer to the links below. Using DataGrid (not GridView) in ASP.net with VB code. Current display in my datagrid: view picture1 here, I want it to be like this view picture2 here The goal is to split my ...

The <span> tag creating a surprise gap following a word

Using Angular4, I've come across an odd issue where one of my span elements is adding an extra space to the end of words like this: https://i.stack.imgur.com/H4TD7.png The only CSS properties that are set include font-family, -webkit-font-smoothing, ...

Creating a specific order for Arabic strings in HTML is simple and can be done by utilizing

I need to adjust the ordering of a datetime written in Arabic numbers. I must use an Arabic string and currently have the following C# code written in Arabic: std.InnerText = "17-02-2016"; The current output is in Arabic numerals, displayed as ٢٠١٦- ...

How can I dynamically set the width of a span element in HTML?

Hello there! As a beginner in html and angularjs, I'm experimenting with dynamically assigning span width based on an angular js response. <div class="statarea" ng-repeat="x in names"> <div class="ratingarea"> <div class=" ...

Utilizing Outlook's SMTP server to dispatch an email

I've spent a significant amount of time researching, but I haven't been able to find any solutions that work for my current issue. I'm trying to send an email through my Windows Live email using their SMTP server, but I keep encountering the ...

Begin one lesson, end all others

Looking for help with my expandable list menu that I created using jQuery. Here is the code snippet: $("#menu ul li ul").hide(); $("#menu ul li").click(function() { $(this).find("ul").slideToggle(); }); You can view the fully functional menu on jsFi ...

Elements generated from bootstrap's divs are not produced in a single line

I'm attempting to have a div append multiple other divs with the class "card" from Bootstrap, but instead of being created in a horizontal line, they are stacked on top of each other. I have tried to modify the "card" class by adding display: inline- ...

The ultimate guide to personalizing group titles in Angular UI-Select

Is there a way in Angular ui-select to customize the group label? I want to make it larger than the selection items as shown in the image below. https://i.stack.imgur.com/ofcak.png The list is currently grouped by country, but how can I adjust the size o ...

Utilizing jQuery's POST Method to Fetch JSON Data on a Website

I've developed a Java REST API and now I want to retrieve JSON data on my website (which is built using HTML & CSS) by utilizing jQuery. The method to be used is POST, and here is the structure of my JSON: { "sessionID" : "25574", "interactiv ...

Implementing transparency to clip-path using HTML and CSS

How can I apply opacity to the clip-path/clip area, similar to the image shown below? Please find my code snippet for reference: .item--clip .demo { width: 200px; height: 250px; } .item--clip .has-mask { position: absolute; clip: rect(10px, 19 ...

Looking for assistance with text alignment?

23 Years Young From: The Boogie Down Bronx Heritage: Puerto Rican Pride Trade: Master Tailor For a demonstration, click on this link ...

The TextField component in MUIv5 is showing some frustrating white space in the corners

I've integrated the MaterialUI_v5 library and included a TextField component within a Paper component. The background of the Paper component has been customized to appear in a shade of green. For the Textfield component, I have applied a styling tha ...

GoogleCloud Firestore credentials for asp.net are currently inaccessible

While attempting to follow the instructions provided in this tutorial for connecting to Firestore, I encountered an error. "System.InvalidOperationException: 'The Application Default Credentials are not available. They are available if running in ...