
Ahmed Ilyas
Top achievements
Rank 1
Ahmed Ilyas
asked on 30 Jan 2013, 02:14 AM
When we have a RadMenu like this below, with the width set to 100%:
http://demos.telerik.com/aspnet-ajax/menu/examples/appearance/imageonly/defaultcs.aspx?#qsf-demo-source
how can I have a custom literal control (asp literal) sit on top of the menu bar but positioned to the far right of the menu bar? What styling/code would I need to add to set the position of the literal to be on top of the menu bar to the far right?
http://demos.telerik.com/aspnet-ajax/menu/examples/appearance/imageonly/defaultcs.aspx?#qsf-demo-source
how can I have a custom literal control (asp literal) sit on top of the menu bar but positioned to the far right of the menu bar? What styling/code would I need to add to set the position of the literal to be on top of the menu bar to the far right?
6 Answers, 1 is accepted
0

Princy
Top achievements
Rank 2
answered on 30 Jan 2013, 04:22 AM
Hi Ahmed,
Hi I tried the following markup and was able to get the scenario that you have mentioned.
Please check the attached screenshot as well.
aspx:
Thanks,
Princy.
Hi I tried the following markup and was able to get the scenario that you have mentioned.
Please check the attached screenshot as well.
aspx:
<
div
style
=
"float: right"
>
<
asp:Literal
ID
=
"Literal1"
runat
=
"server"
Text
=
"Your Heading"
>
</
asp:Literal
>
</
div
>
<
br
/>
<
telerik:RadMenu
ID
=
"RadMenu1"
runat
=
"server"
Width
=
"100%"
>
<
Items
>
<
telerik:RadMenuItem
Text
=
"Products"
>
</
telerik:RadMenuItem
>
<
telerik:RadMenuItem
Text
=
"Purchase"
>
</
telerik:RadMenuItem
>
<
telerik:RadMenuItem
Text
=
"Community"
>
</
telerik:RadMenuItem
>
<
telerik:RadMenuItem
Text
=
"Corporate"
>
</
telerik:RadMenuItem
>
</
Items
>
</
telerik:RadMenu
>
Thanks,
Princy.
0

Ahmed Ilyas
Top achievements
Rank 1
answered on 30 Jan 2013, 09:01 AM
thank you. Almost..... except that the literal, I would like that to be sitting in front of the rad menu. Same positioning but just sitting infront of the radmenu
0
Accepted

Shinu
Top achievements
Rank 2
answered on 31 Jan 2013, 06:06 AM
Hi Ahmed,
I am not quite sure about your scenario,I suppose you mean on top of Radmenu instead of infront of.
aspx:
Thanks,
Shinu.
I am not quite sure about your scenario,I suppose you mean on top of Radmenu instead of infront of.
aspx:
<
div
style
=
"float: right;margin-left:92%; margin-top: 22px; position: absolute; z-index: 10001"
>
<
asp:Literal
ID
=
"Literal1"
runat
=
"server"
Text
=
"Your Heading"
>
</
asp:Literal
>
</
div
>
<
br
/>
<
telerik:RadMenu
ID
=
"RadMenu1"
runat
=
"server"
Width
=
"100%"
>
<
Items
>
<
telerik:RadMenuItem
Text
=
"Products"
>
</
telerik:RadMenuItem
>
<
telerik:RadMenuItem
Text
=
"Purchase"
>
</
telerik:RadMenuItem
>
<
telerik:RadMenuItem
Text
=
"Community"
>
</
telerik:RadMenuItem
>
<
telerik:RadMenuItem
Text
=
"Corporate"
>
</
telerik:RadMenuItem
>
</
Items
>
</
telerik:RadMenu
>
Thanks,
Shinu.
0

Ahmed Ilyas
Top achievements
Rank 1
answered on 31 Jan 2013, 11:02 AM
thats exactly what I wanted as per the attachment but for some reason in code, it does not quite work. it places the literal underneath the menu (but in the right position).
using IE 9 here.
See attached screenshot.
Now, if i place a <br> underneath the div, the literal disappears somewhere... so its not visible on the page (but you can see it there in view source)
FYI, im adding menu items from codebehind dynamically.
using IE 9 here.
<
div
style
=
"float: right;margin-left:92%; margin-top: 22px; position:absolute"
>
<
asp:Literal
runat
=
"server"
ID
=
"litUserLoggedInDetails"
/>
</
div
>
<
telerik:RadScriptManager
runat
=
"server"
ID
=
"RadScriptManager1"
/>
<
telerik:RadMenu
runat
=
"server"
ID
=
"RadMenuItems"
Height
=
"40px"
Width
=
"100%"
ForeColor
=
"White"
>
<
DefaultGroupSettings
OffsetY
=
"-1"
/>
</
telerik:RadMenu
>
See attached screenshot.
Now, if i place a <br> underneath the div, the literal disappears somewhere... so its not visible on the page (but you can see it there in view source)
FYI, im adding menu items from codebehind dynamically.
0

Ahmed Ilyas
Top achievements
Rank 1
answered on 31 Jan 2013, 11:05 AM
please ignore my post. I didnt read the full div style supplied - the key element was the z-index. this worked.
Now there is a blank line/row ontop of the menu. how can I get the menu to stay at the top and remove that empty line?
Many thanks!
Now there is a blank line/row ontop of the menu. how can I get the menu to stay at the top and remove that empty line?
Many thanks!
0
Hello Ahmed,
Can you please clarify what is the appearance that you are getting (a simple image demonstrating is would be very helpful)? Can you also provide some code that will help us replicate the appearance from my side and help you out?
Greetings,
Kate
the Telerik team
Can you please clarify what is the appearance that you are getting (a simple image demonstrating is would be very helpful)? Can you also provide some code that will help us replicate the appearance from my side and help you out?
Greetings,
Kate
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.