Messed up layout after Authentication

Jul 28, 2010 at 11:40 AM

Hello everyone,

The layout gets all messed up as soon as I log into the site - messed up as in page parts are misplaced.

 

I edited the portal to use SqlMembershipProvider and related Login controls. I'm pretty sure this happened before my modifications as well.

 

Any kind soul able to spot the problem?

 

Thanks in advance and thanks for the portal,

Rob

Jul 28, 2010 at 3:30 PM

I would need to be able to see the site to inspect the html to determine how it gets messed up after you log in.  I have not seen this behavior before.

Shan McArthur
www.shanmcarthur.net

Jul 28, 2010 at 7:25 PM
Shan, thanks a lot for taking the time to reply. It's appreciated. I don't have access to our dev VM right now - if you don't mind, I'll post some screenshots tomorrow as soon as I can. Thanks again, Rob
Jul 29, 2010 at 12:26 PM
Edited Jul 29, 2010 at 12:28 PM

Please see the following picture (uploaded to my personal host); also, the tabbed menu in top of the page is replaced by a simple link list.

http://www.rainweaver.org/portal.png

Let me know if I need to provide more details.

Thanks,
Rob

Jul 29, 2010 at 2:38 PM

I had the same issue, so I used the css formating to lock certain parts of the portal header in place rather than using relative positions.

I added a custom CSS file to the list of existing files for my overrides to avoid changing the default portal

/************************************************** BITP Site Mods********************************************/
/** Set URL Link colors **/
a:link {color: #281458;}
a:active {color: #FFFFFF;}
a:visited {color: #6A518A;}
a:hover {color: #FF6600;}

 /* Move all content to center for floating center #layout   {text-align: center;}*/
#hd     {margin: auto; position: relative; left: -4px; width: 975px; height: 169px;}/** Set up Header block in center **/
#hd p   {position: relative; left: -4px; height: 125px; padding: 0 0 0 0;} /** Fix LOGO Position */
#hd-links  {position: absolute; top: 110px; width: 975px;} /** ;Fix Login Position to appear in Beige area just above primary nav */
/* Primary Navigation formatting */
#hd-nav1  {position: absolute; top: 131px; margin-left: 8px;} /**  Move primary nav to clear background line on left */
#hd-nav1  {display: inline; margin:0px auto; padding: 0; height:38px; }
#hd-nav1 .left, .right, .navigation1, .navigation1 ul, .navigation1 LI
    {padding: 0; margin: 0; height:38px; float:left; display: inline; list-style-type: none; font-size:15px; }

#hd-nav1 .navigation1 {clear: none; margin: 0 0 0 0;} /**  Move primary nav to clear background line on left */
#hd .navigation1 li a { display: block; margin: 0 0 0 1px; padding: 8px 12px; text-decoration: none; white-space: nowrap;}
#hd-nav1 .left, .right {width:21px;margin-left:1px;}
#hd-nav1 .left {margin-left:4px;}


#main .breadcrumbs {border-bottom: none;}
#bd    {/** Set Full width repeating Body background (Actually the header background)*/
    margin: auto; background: #ffffff url(../images/CSS/backgrounds/content_bg_975.jpg) no-repeat center top;
    width: 975px; text-align: left;}
#ft    {color: #281458; padding:  0 0 0 0;} /** Footer setup*/
#ft .footer  {margin: auto; width: 975px; }
#ft .section {padding: 0 15px 5px 15px; width:45%;} /* Setup for Left & right snippets below new footer */

Jul 30, 2010 at 10:18 AM

stephenvnoe, thanks for posting the stylesheet - much appreciated. Will give feedback when I have access to our dev vm again.

Sep 1, 2010 at 1:19 PM
Edited Sep 1, 2010 at 3:19 PM

Sorry for the delay - took me a while to be able to test your css. I'm afraid the stylesheet did not seem to fix the problem - unless I'm referencing the file in the wrong place.

I modified the Default.master MasterPage and included a reference to a css file right beneath the other css files. No luck!

 

Any additional help is much appreciated.

PS: Always after logging in, using SqlMembershipProvider.