asp.net css inline formatting

Question

I'm using 2 menus with a label above each. I'm trying to align them side by side however I'm having trouble. It is acting as if there is a <br/> in between #MenuFooter1 and #MenuFooter2.Notice I'm using a <br/> after the labels. Current result:https://i.sstatic.net/NMi0e.png

<div id="footer">
     <div class="MenuFooter1"> 
     <asp:Label ID="lblAdvantages" runat="server" Text="Advantages" ForeColor="#ab2548" Font-Bold="False" Font-Size="Large"></asp:Label><br />

      <telerik:RadMenu ID="MenuFooter1" runat="server" OnClientItemClicked="MenuNavBar_ItemClicked" Skin="Transparent" Flow="Vertical" >
        <Items>                 
            <telerik:RadMenuItem runat="server" Text="Why ?" NavigateUrl="http://" Font-Bold="False" Font-Size="Large" BackColor="White" BorderColor="White" ForeColor="#999999" Font-Names="Arial">
            </telerik:RadMenuItem>              
            <telerik:RadMenuItem runat="server" Text="View the Data" NavigateUrl="http://" Font-Size="Large" BackColor="White" BorderColor="White" ForeColor="#999999" Font-Names="Arial">
            </telerik:RadMenuItem>              
            <telerik:RadMenuItem runat="server" Text="Advocates" NavigateUrl="http://" Font-Size="Large" BackColor="White" BorderColor="White" ForeColor="#999999" Font-Names="Arial">
            </telerik:RadMenuItem>

        </Items>
    </telerik:RadMenu>
    </div>
    <div class="MenuFooter2" >
        <asp:Label ID="Label1" runat="server" Text="Advantages" ForeColor="#ab2548" Font-Bold="False" Font-Size="Large"></asp:Label><br />
     <telerik:RadMenu ID="MenuFooter2" runat="server" OnClientItemClicked="MenuNavBar_ItemClicked" Skin="Transparent" Flow="Vertical" style="top: 0px; left: 0px">
        <Items>                 
            <telerik:RadMenuItem runat="server" Text="Why?" NavigateUrl="http://" Font-Bold="False" Font-Size="Large" BackColor="White" BorderColor="White" ForeColor="#999999" Font-Names="Arial">
            </telerik:RadMenuItem>              
            <telerik:RadMenuItem runat="server" Text="View the Data" NavigateUrl="http://" Font-Size="Large" BackColor="White" BorderColor="White" ForeColor="#999999" Font-Names="Arial">
            </telerik:RadMenuItem>              
            <telerik:RadMenuItem runat="server" Text="Advocates" NavigateUrl="http://" Font-Size="Large" BackColor="White" BorderColor="White" ForeColor="#999999" Font-Names="Arial">
            </telerik:RadMenuItem>

        </Items>
    </telerik:RadMenu>
     </div> 
    </div>

css

#footer {
        padding:80px;
        display:inline;
        }

     .MenuFooter1, .MenuFooter2 {
        display:block;}

Scott Selby · Accepted Answer · 2014-04-14 20:38:56Z

1

change block to inline-block

 #MenuFooter1, #MenuFooter2 {
        display:inline-block;}

answered Apr 14, 2014 at 20:38

Scott Selby

9,58012 gold badges63 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user3191137 Over a year ago

Thanks, works like it should. I think I tried that at one point however I found my problem was that I referred my MenuFooter classes as ID's in the css. smh

user3191137 Over a year ago

Thanks for the reminder. Wasn't able to accept so quickly yesterday.

Collectives™ on Stack Overflow

asp.net css inline formatting

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related