Hi,
In your website
http://demos.telerik.com/aspnet-ajax/editor/examples/editorastextbox/defaultcs.aspx
There is a RadEditor as a TextBox control available for Demo.
My requirement is to remove the Bottom Space between Vertical Scroll Bar and Bottom Border(Refer the attachedimage).
Please guide me to fix this.
WIth Advanced Thanks,
Jawahar
In your website
http://demos.telerik.com/aspnet-ajax/editor/examples/editorastextbox/defaultcs.aspx
There is a RadEditor as a TextBox control available for Demo.
My requirement is to remove the Bottom Space between Vertical Scroll Bar and Bottom Border(Refer the attachedimage).
Please guide me to fix this.
WIth Advanced Thanks,
Jawahar
3 Answers, 1 is accepted
0
Hi,
There are three table rows under that table row in which is placed the editable iframe of the content area and even when you hide the elements in these 3 rows the empty space will persists as shown in the following video: http://screencast.com/t/5wetzMUX, because this is a browser behavior.
Best regards,
Rumen
the Telerik team
There are three table rows under that table row in which is placed the editable iframe of the content area and even when you hide the elements in these 3 rows the empty space will persists as shown in the following video: http://screencast.com/t/5wetzMUX, because this is a browser behavior.
Best regards,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0

jawahar
Top achievements
Rank 1
answered on 29 Aug 2012, 04:33 AM
Thanks for your reply.
What you mean is its not possible to remove that space in all browser. Am i right?
Now i am testing it in IE8.
Thanks,
Jawahar.
What you mean is its not possible to remove that space in all browser. Am i right?
Now i am testing it in IE8.
Thanks,
Jawahar.
0
Hi,
I have tested that scenario and found that the problem on live demos is caused by the doctype 1.1:
If you change it with 1.0 Tranistional, the unwanted space will disappear:
If you however would like to use <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">, you could archive a partial fix using CSS (marked yn yellow):
As it is mentioned in the CSS commnet, you should check with firebug what is the inline height applied to reWrapper element and to apply the same height to reContentCell element using !important.
Greetings,
Bozhidar
the Telerik team
I have tested that scenario and found that the problem on live demos is caused by the doctype 1.1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
If you change it with 1.0 Tranistional, the unwanted space will disappear:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
title
></
title
>
<
style
type
=
"text/css"
>
/* The following CSS needs to be copied to the page to produce textbox-like RadEditor */
.reLeftVerticalSide, .reRightVerticalSide, .reToolZone, .reToolCell {
background: white !important;
}
.reToolCell {
display: none\9 !important; /* for all versions of IE in order to prevent border bottom disappearing */
}
.reContentCell {
border-width: 0 !important;
}
.formInput {
border: solid 1px black;
}
.RadEditor {
filter: chroma(color=c2dcf0);
}
.reWrapper_corner, .reWrapper_center {
display: none !important; /* for FF */
}
td.reWrapper_corner, td.reWrapper_center {
display: block\9 !important; /* for all versions of IE */
}
.top {margin-top: 200px;}
</
style
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
asp:ScriptManager
ID
=
"ScriptManager1"
runat
=
"server"
>
</
asp:ScriptManager
>
<
telerik:RadEditor
Height
=
"150px"
Width
=
"300px"
ToolsWidth
=
"330px"
EditModes
=
"Design"
ID
=
"RadEditor1"
runat
=
"server"
ToolbarMode
=
"ShowOnFocus"
ToolsFile
=
"tooltext.xml"
CssClass
=
"top"
>
</
telerik:RadEditor
>
</
form
>
</
body
>
</
html
>
If you however would like to use <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">, you could archive a partial fix using CSS (marked yn yellow):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
title
></
title
>
<
style
type
=
"text/css"
>
/* The following CSS needs to be copied to the page to produce textbox-like RadEditor */
.reLeftVerticalSide, .reRightVerticalSide, .reToolZone, .reToolCell {
background: white !important;
}
.reToolCell {
display: none\9 !important; /* for all versions of IE in order to prevent border bottom disappearing */
}
.reContentCell {
border-width: 0 !important;
}
.formInput {
border: solid 1px black;
}
.RadEditor {
filter: chroma(color=c2dcf0);
}
.reWrapper_corner, .reWrapper_center {
display: none !important; /* for FF */
}
td.reWrapper_corner, td.reWrapper_center {
display: block\9 !important; /* for all versions of IE */
}
.top {
margin-top: 200px;
}
/* doctype 1.1 fix */
.reContentCell {
height: 150px !important; /* this height should be qual to reWrapper element inline height, which in that case is 150px */
}
.reContentCell iframe {
border-bottom: 1px solid #828282;
}
</
style
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
asp:ScriptManager
ID
=
"ScriptManager1"
runat
=
"server"
>
</
asp:ScriptManager
>
<
telerik:RadEditor
Height
=
"150px"
Width
=
"300px"
ToolsWidth
=
"330px"
EditModes
=
"Design"
ID
=
"RadEditor1"
runat
=
"server"
ToolbarMode
=
"ShowOnFocus"
ToolsFile
=
"tooltext.xml"
CssClass
=
"top"
>
</
telerik:RadEditor
>
</
form
>
</
body
>
</
html
>
As it is mentioned in the CSS commnet, you should check with firebug what is the inline height applied to reWrapper element and to apply the same height to reContentCell element using !important.
Greetings,
Bozhidar
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.