VS 2010 - Centering Page With Min And Max Widths

Nov 1, 2010

I want my webpage to be centered in the browser, but at the same time also have a minimum and maximum width.

I know I can center the page (well, the div element really) by setting the margin-left and margin-right CSS properties to auto. This works just fine and the page is centered, with room to spare on both the left and right side.

But, if your monitor is wide, this space is wasted, and I want the page to expand in that case. So instead of using 'auto' for the margin-left and margin-right properties, I used a fixed margin of 50px on both sides. Now, the site expands and shrinks with the browser nicely, and it is still centered.

However, I don't want the site to become too small, otherwise elements start overlapping. So, I set the min-width property in the CSS to 800px. This still works fine. I can resize the browser and the page shrinks, until it hits 800px then it simply stays in place.

The relevant CSS at this time is:

Code:

.page
{
margin: 10px 50px 10px 50px;
min-width: 800px;
}

A new problem now occurs when the browser window is too large. In that case the contents of the site are all on the left side, and the right side of the page (the page mainly consists of a grid) is empty. So what I want now is to also set a maximum width. I tried doing that by simply setting the max-width property in the CSS (to 1650px):

Code:

.page
{
margin: 10px 50px 10px 50px;
min-width: 800px;
max-width: 1650px;
}

This doesn't work the way I want though. While it doesn't expand the site further than 1650px, the site is no longer centered when the browser window is larger than that. The margin is kept fixed at 50px on the left, but it grows on the right side (because the page cannot grow any further).

So, I thought I could set the margins back to auto:

Code:

.page
{
margin: 10px auto 10px auto;
min-width: 800px;
max-width: 1650px;
}

While the page is large enough, this works just fine, the page is centered. However, if I now shrink the window again, so that the width of the page is below the max-width, there is no longer a margin on the left and right sides! The page just sits right against the browser edge...


What I basically need is a way to set the margin to auto, but with a minimum margin of 50px. Is that possible?

View 14 Replies


Similar Messages:

AJAX :: UpdatePanelAnimationExtender Animation Not Re-centering After Window Resize Or Page Scroll

Oct 28, 2010

I want my UpdatePanelAnimationExtender animation to always show in the center of the browser window even after a window resize or page scroll. The animation does re-center horizontally after a window resize but not vertically. It does not re-center after either a vertical or horizintal page scroll. I get the same behavior in IE 8, Safari & Firefox. Below is my code:

[Code]....

View 1 Replies

Login Control Not Centering?

Mar 1, 2010

I have an aspx Login control and I would like to center it on the screen.

How can i accomplish this? I've tried applying text-align: center on it.

View 2 Replies

AJAX :: UpdatePanel Content Not Centering

Mar 9, 2011

I'm having an odd problem. I have a <td> that is set to align it's content in the center. There is a label at the top of the TD that is centered. But then I have an UpdatePanel, and the content of the update panel is not centered. I tried clearing the browser cache, and everything in between but for some reason all of the contents (two GridViews) of the UpdatePanel will not center.

View 3 Replies

Centering A Sortable Row Header In The GridView?

Mar 15, 2011

I cannot seem to center the header text of a column in my GridView if it is sortable. The html output is much different for a sortable column (it seems to place a table inside of the td column).

Any thoughts on what can be done to get this centered?

I put the html ouput in a jsfiddle here ... [URL]

I have tried the following code on the grid view with no success. Bear in mind that the bound fields are server controls I designed but they do not affect the header text in any fashion:

<sc:DateBoundField DataField="LastLogin" SortExpression="LastLogin" HeaderText="Last Login"
HeaderStyle-Width="125px" ItemStyle-Width="125px" HeaderStyle-HorizontalAlign="Center" />
<sc:SCommandButtonField Command="Change" ItemStyle-Width="100px" HeaderStyle-Width="100px"
HeaderText="Change" HeaderStyle-HorizontalAlign="Center" Image="img.axd?ico16=edit" />

View 2 Replies

Forms Data Controls :: Centering On Screen The Edited Record?

Apr 18, 2010

How to make the selected record (area) for editing to be in the center of the screen?

I have a GridView with custom Edit functionality. I have panel, table and some controls for updating in the EditItemTemplate area. When the user selects to edit a record, I want the edited record area to be aligned in the center of the screen. What is happening now is, with the gridview having many records; the user has to navigate to find where the edit box displayed!

View 7 Replies

C# - Unable To Set GridView Row Widths On RowDataBound?

Jul 26, 2010

My current code to attempt to set widths for the rows on a gridview is:

protected void RowDataBound(Object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Header)
{
foreach (DataControlFieldHeaderCell dcfhc in e.Row.Cells)
{
dcfhc.Width = 100;
}
}
else
{
foreach (DataControlFieldCell dcfc in e.Row.Cells)
{
dcfc.Width = 100;
}
}
}

But that just keep all of the widths default! What am I doing wrong?

EDIT: I have already tried thise code as well!
PoolToDBHeaders.DataSource = new DataView(headerTable);
PoolToDBHeaders.DataBind();
foreach (DataControlField dcf in PoolToDBHeaders.Columns)
{
dcf.ItemStyle.Width = 100;
}
PoolToDBHeaders.DataBind();

View 1 Replies

AJAX :: TabContainer Style - How To Set The Different Widths / Positions

Jul 16, 2010

I am using two different TabContainer's on a single aspx page and I'd like to set the different widths, positions etc. using CSS. So far, this is what I have written:

[Code]....

The first TabContainer's CSSClass = Main, however this still affects the other TabContainer present.

View 2 Replies

Forms Data Controls :: Unable To Format Column Widths

Jun 3, 2010

I'm creating a ListView and have been unable to format column widths. After much research I have found that the width property of the <asp:Label doesn't work. I'm using

<asp:Label
ID="lblVCArea"
runat="server"
width="10"
BackColor="Aqua"
Text='<%# Eval("VCArea") %>'
/>

I test the FormView by changing the width property and it doesn't affect the width of the column. The <th control in the layout template has a width="60" that appears to be working. If I remove the <asp:label from the <td in the Item and AlternateItem templates, the width is set to 60. When I paste the <asp:label back into the <td, the width of the column increases to about 200px even though the width is set to 10. I set the backcolor to Aqua to see the label and it is about 200 px widt.

View 10 Replies

Best Practice To Manage Telerik RadGrid Grid And Column Widths?

May 25, 2010

I wanted to ask what is the best practice to manage width of the radGrid.

For my application most users are running 1280 x 1024 so I would be happy to set my overall grid width to 1100. However, depending on the form in use, I sometimes have horizantal scroll bars. To solve this, I have been playing with the width of the grid, and also I have played with setting the itemstyle-width for one or two columns. Sometimes I accidentally get it right, and sometimes it is not quite right.

What is the best way to manage this? Do I set the grid, and then all columns, or just the grid, or just the columns? I guess there is a best practice, so just wondering how you handle it,

View 2 Replies

Forms Data Controls :: Adjust Gridview Column Widths?

Apr 1, 2011

Earlier,I was having UltrawebGrid control in my aspx page.Due to performance issues, we have replaced it with asp:GridView control.We needall the functionalities implemented with the UltrawebGrid using the gridview.With UltrawebGrid , the user was allowed to adjust the column widthsby dragging and save it.Is there any possible way to achieve this using GridView?

View 3 Replies

Forms Data Controls :: TextBoxes Messes Up GridView Column Widths?

Apr 1, 2011

My problem is: The GridView normally fits the grid perfectly to the data so that each cell only spans one row and has the appropriate column widths. However, when I add a row of TextBoxes to the bottom of this grid, the column widths suddenly all become equal, so that some cells with lots of words span multiple rows. Is there anyway to prevent this?

View 4 Replies

Web Forms :: To Use Response.Write To Adjust Column Widths When Exporting Data To MS Excel?

Feb 14, 2010

Is there a simple way to use Response.Write to adjust column widths when exporting data to MS Excel?

View 3 Replies

Web Forms :: (Resolved) Dynamic Table Creation - Unable To Display Columns With Different Widths

May 23, 2010

I am trying to create a table at runtime which is populated from information in a database. At the present time the table displays as follows: The problem is I need the "test test" text to be in the middle of the table, however if I show a box around the cell it only takes up the 1st half of the table regardless of the width I specify. Is it possible to have a dynamic table that effectively has rows where the cells are merged together in a specific way to allow the control to be positioned where I want it? THe code I am using to create the table is as follows:

[Code]....

where I am going wrong or is what I am trying to achieve not possible with a dynamic table?

View 2 Replies

Web Forms :: Does The "div" Do Anything That A Panel Won't Other Then To Allow Centering Horizontallyl

Feb 9, 2011

Is the div tag really needed vs the panel.For example, the dragpanel extender targes the panel control.
I runt across situation where it is an obstacle to use divs. For example if I have a div wrapping a panel, when I drag the panel, the div stays put.I was considering just getting rid of all my divs but didn't want to until I was sure it was ok.

View 5 Replies

Forms Data Controls :: Column Chart Has Inconsistent Column Segment Widths?

Jan 3, 2011

[Code]....

Stacked-column chart has inconsistent column segment widths

View 1 Replies

VS 2010 - Stop Master Page Redraw / Only Refresh Content Page?

Jul 20, 2012

I am writing a web application which consists of a master page (header / menus) which does not change and content pages. When I do something like click on a button it causes a post back which is correct but this redraws the whole screen and becomes annoying because every post back and the whole screen flickers.

Is there a way to only refresh the content page?

View 5 Replies

VS 2010 - Change Menu Items On Master Page Depending On Content Page Selection

Feb 15, 2012

I have a master page with an unordered list that contains items like, Home, Messages etc.

Now I am working on an EditProfile.aspx page and I want the menu to change and have items like Basic Information, Profile Picture etc. Sort of like facebook. What is the best way to accomplish this...

View 2 Replies

VS 2010 - Prompt User Before Navigating Away From A Page And Perhaps Stay On Page

May 15, 2012

I need to check information the user has entered on a page against what I have in my database to see if he is entering duplicate data. It is up to him if he wants to proceed or not. I just need to alert him.

The problem is I don't own the button that he clicks so I can't hook up a javascript confirm to the button click. I am running within vendor code. I have an "override PageLoad()" procedure where I can test what page they're currently on. If they are on page "EditForm.aspx" and would normally navigate to "UserFinish.aspx" without any custom code of mine "interfering", I want to test what they've entered on EditForm.aspx and present them with a popup if they've entered duplicate info, and if they click OK button then proceed to UserFinish but if they click Cancel then stay on EditForm.

View 6 Replies

VS 2010 - Adding Linkbuttons To A Page Dynamically On Page Load

Jun 1, 2012

Ok, so I'm adding linkbuttons to a page dynamically on page_load.I had it to where the link buttons were redirecting to a page with a query string attached. I was attempting to use the AjaxToolKit's AjaxFileUploader and ran into issues with existing query strings.

So what I'm trying to do now is handle the click event of the linkbutton server side, set 2 session variables and then redirect the page to the same page, but with out appending a querystring so the ajaxfileuploader will work correctly.Here is my linkbutton code:

vb Code:
Dim Lin As New LinkButton                   
Lin.Text = dr("DeptDesc").ToString                   
Lin.CssClass = "deptlink"                   
Lin.ToolTip = CDate(dr("MeetingDate").ToString).ToFileTime.ToString                   
'Lin.OnClientClick                   

[code]....

I know I have Lin.PostBackURL and Lin.setAttribute(...). It didn't work with just setAttribute and I saw a post online about someone setting the PostBackURL and it working...

View 1 Replies

VS 2010 - Working With Master Page From Content Page

Aug 31, 2012

I have the following in my master page:

Code:
<span id="Quote" class="hide">..........

In my code behind on the content page of page load I want to change the class="hide" to class="show" How can I do that?

View 5 Replies

VS 2010 - Master / Child Page Layout - Embed Third Party Website As Child Page

Aug 29, 2011

I have a web application that uses the master/child page layout you get by default (at least in a VS2010 web project). The Masterpage has a NavigationMenu, each item on that NavigationMenu has a NavigateUrl that looks like "~/Pages/MyPage.aspx". This automatically opens 'MyPage' in the Content of the Masterpage, so that the master page with menu and header etc stays visible.

Now, the client has a guestbook on her old website (I'm basically rebuilding her website, adding the ability for her to upload new content in her browser), and she wants to keep it. This guestbook is from a 'free guestbook' third party website, over which I have no control. It's simply a website in the form [URL] .... which shows the guestbook for a user 'Username'.

In her old website, I was using frames, so the menu on the left side was in a different frame, and I would simply open the third party website in the center frame. That would create the illusion that the guestbook was on her site, while it was actually a completely different website in a separate frame.

In my new website I'm no longer using frames, but the master/child layout as explained. Is it still possible to 'host' or 'embed' this third party website as a 'child' of the master page?

I tried just putting the url to the guestbook in the NavigateUrl of a NavigationMenu item, but that doesn't work, it just navigates to the third party website and doesn't embed it in any way.

View 6 Replies

VS 2010 - How To Add A ModalPopupExtender To A Page

Feb 18, 2011

I am trying to add a ModalPopupExtender to a page I am using. But every time I try to add the ModalPopupExtender, it show an error on the bottom left of the IE page saying Object Not Supported.

I have put in the minimal amount of code required to use the modalpopupextender (i.e., just controlIDs) and it throws an error. If I comment it out, I get no errors on the page.

Stranger still, the Object not supported error states that it's at line 916, character 1, yet viewing the source only shows 343 lines of code? I have been trying to figure this out for a day now with no luck. I follow every tutorial I can find on the web for the modalpopupextender and everything is great until I put in the actual control.

View 1 Replies

VS 2010 - How To Rewrite 404 Page

Feb 19, 2013

I have create new site and don't know how to rewrite 404 page

View 1 Replies

VS 2010 - How To Prevent Web Page Going To Top Left

Apr 1, 2012

I have web page in asp.net and it goes to top left in web browser in different resolutions (with pressing ctrl n scrolling mouse) and controls also comes out of tables n div.

View 3 Replies







Copyrights 2005-15 www.BigResource.com, All rights reserved