Start Free Trial

asked on

How to display the footer inside the Scrollable div on .aspx page

Hi Rouchie,

You helped me solving this problem before. Now I published the application on Development server.The problem came again.

The footer was outside the Div and alignment and appearance distorted for some of the page where as everything is good on my machine.

Will you help me in finding the reason for this problem.

Thanks

Can you post the live URL please? You had problems with other style sheets interfering last time

ASKER

Hi Rouchie,

Please see the attached files.
For Grab1 we need to fix the Footer issue. The Footer should be after the Horizontal line.It is after the Horizontal line on my machine.
For Grab2 the column headers should not wrap. On my machine Maximum Amount Financed,Auto Pay APR and Coupon Book APR are in single line.

But after publishing it to Dev it is different.

Please advise.

Thanks
Grab1.png
Grab2.png

ASKER CERTIFIED SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,
Thanks for your response.
The attached files having the live version code for Grab1 and Grab2.

What do you mean by link.I don't have any live link.

Scrollable div is good for users to edit the Grids.
Grab1.aspx
Grab2.aspx

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,
Please find th live link attachments.
After I saved the page as .htm the footer is inside the div after horizontal line. But in the browser as .aspx page it is outside the div.

You can see that in grab1.png

For Grab2.htm the column headers should not wrap. On my machine Maximum Amount Financed,Auto Pay APR and Coupon Book APR are in single line.But after publishing it is not.

Thanks
Grab1.htm
Grab2.htm

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,
Thanks for you suggestions.
The footer is displaying properly after commenting position:relative property in .grid_11 css class.Issue 1 solved.

Please look into Grab2.htm the column headers issue.
I am attaching the Web_Message.css file. On my machine Maximum Amount Financed,Auto Pay APR and Coupon Book APR column headers are in single line.But after publishing it is not.
Can you please look into that.

Please let me know if you need to know anything else.
Web-Messages.css
Grab2.htm

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,
Thanks for all your valuable advices. I am making changes and let you know once I am done with it.

One thing I need to mention that there is lot of empty white space before the Scrollable Div. How to get rid of it.It is not showing any empty space on my machine.
But after publishing it is showing lot of empty space before the Div.
I tried to give the live link.But after saving it as .htm there is no empty space.
The Div is using follwing css classes. I commented padding and margin properties but still empty space is there.

Any suggestion on this please.
html {
padding:0px;
margin:0px;
}

body {
background-color: Transparent;
font-size: 11px;
font-family: Arial;
color:#000;
text-align:center;
margin:0px 0 0 0 0;
padding-bottom: 5px;
padding-left : 5px;
padding-right : 5px;

}

div.scrollLoan {
height:400px;
overflow: auto;
border: 1px solid #666;
background-color: #CCD3EA;
padding-top: 8px;
padding-bottom: 8px;
padding-left: 8px;
padding-right: 8px;

}

Regards

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,
Please find the attached image.I don't want the empty space before the Div.
Please take a look.

Thanks
Grab3.png

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,
I tried that. It is using only red border properties. When I unchecked any of these properties the empty space gone and looks normal.

I tried with out the red border properties.As usual it is showing the empty space.I couldn't able to find the reason.If you have any other idea to get rid of it ,please let me know.

Please give me any online link or material to get grip with Content, Table controls and Div's.

Thanks

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,

I attached the page with the empty space before scrollable Div.When I saved it as .htm the empty space gone.But as .aspx page in browser it is having empty space.
I attached saved page and style sheet that is being in use web_messages.css.

Please let me know any online link or material to get grip with Content, Table controls and Div's.

Thanks
Grab.htm
StyleSheet1.css

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,
Thanks for your help.

I didn't even get the white space after saving it as .htm.It is showing the white space in browser.
StyleSheet1.css is same as web_messages.css

While testing with Developer tools when I unchecked one of the top properties in div#header the white space is gone.So I commented the div#header.
I didn't even find the page.
div#header{
position:absolute;
top:0;
left:0;
width:100%;

}

960.css file has only one style:

.grid_1,
.grid_11
{

      display:inline;

      float: left;

      position: relative;

      margin-left: 10.0px;

      margin-right: 10.0px;

      color: #525998;

}

One interesting thing I found was when I unchecked any of the properties with Developer tools the white space getting disappeared.

I am using IE.

I didn't even get the rule from css file that might causing the problem.

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie
Sorry, for my late reply.

The Style sheet under App_Themes.
I mentioned <pages theme="Default_Theme"> in Web.config file.So all the pages are using Web_Messages.css file and Web_Messages.skin.
How to make single page is not using Web_Messages.css file which is under Default_Theme.

Thanks

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

It is still showing the style sheet link in view source.But I commented everything in that Web_Messages.css.I don't want to mess up.
<link href="../App_Themes/Default_Theme/Web_Messages.css" type="text/css" rel="stylesheet" /></head>

Whatever styles the page is using declared in the page itself.
Please check.

Thanks
grab.htm

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Also tell me if you have Firefox?

ASKER

Hi Rouchie,
After saving the file to .htm I am not seeing the white space. I am seeing the white space while viewing the .aspx page in browser.

1.I clear the browser content often.That is not a issue at all.
2.I removed all references to height 100% from skin files,HTML and css. But no difference.
I don't have FireFox.Will it be useful for finding the problem.

I want to get grip on content control and Div.Is there any good online stuff.

Thanks

SOLUTION

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

ASKER

Hi Rouchie,

I am not using the Div.Afterthat it is not showing the white space.

Thank you very much for helping me.I will close this ticket.

I will open another Ticket
The issue is when I click the Edit command button the Text Boxes are increased in width and going beyond the Screen.
In other words it is showing horizontal scroll bars and I am using hte Horizontal Scroll bars to view and edit the Text Boxes.

The Page when it is initially requested or in edit mode should occupy not more than 80% of the screen.

I will attach the live link.
The question title will be How to display the page content with in the Screen in Page edit mode.
Please help me.

Thanks

Okay no problem. When you've posted the new question then post a link to it here so I get an email!

ASKER

Question ID:27906896
How to display the page content with in the Screen in Page edit mode.
Thanks

ASKER

Thanks for your time and suggestions.