Wrong place for float:left div .

Question

        <div id="nav-main" align="center" style="width: 95%; height: 35px;">
            <div style="float:left; height: 29px; width: 260px;">
                            <a href="javascript:void(0);" onclick="select();" 
                                style="font-size: small; background-color: #FFFFFF">
                                &#1048;&#1079;&#1084;&#1077;&#1085;&#1080;&#1090;&#1100; &#1082;&#1086;&#1076; &#1080; &#1087;&#1088;&#1080;&#1084;&#1077;&#1095;&#1072;&#1085;&#1080;&#1077;</a>
            </div>
            <div style="float:right; width: 639px;" align="center">
            <asp:Menu ID="Menu2" runat="server" Orientation="Horizontal" Width="521px" MaximumDynamicDisplayLevels="0"
                StaticSelectedStyle-CssClass="StaticSelectedStyle" Height="32px" StaticSubMenuIndent="18px"
                OnMenuItemClick="Menu2_MenuItemClick">
                <StaticSelectedStyle CssClass="StaticSelectedStyle"></StaticSelectedStyle>
                <Items>
                    <asp:MenuItem Text="&#1063;&#1072;&#1089;&#1086;&#1074;&#1099;&#1077;" Value="1" />
                    <asp:MenuItem Text="&#1057;&#1091;&#1090;&#1086;&#1095;&#1085;&#1099;&#1077;" Value="2"
                        Selected="True" />
                </Items>
            </asp:Menu>
            </div>
        </div>

Can't see the left div. and firebug shows it under right div :(

How to self left div to the left side and sure what I'm doing wrong ?

Answer 1

Not sure I totally get what you're trying to do, but as far as getting 2 divs to float next to each other, which I think is what you're asking, try the following. I changed the container from 95% width to fixed width to allow for the fixed size you defined for your divs. And I changed the second div to float:left as well. Even if you want one div to float to the right of the left one, doesn't mean you need to use float:right. If they are both styled with float:left and their defined widths fit within their containing element, the second will float to the right of the first. Hope that helps.

<div id="nav-main" align="center" style="min-width: 900px; width:95%; height: 35px;">
        <div style="float:left; height: 29px; width: 260px;">
                        <a href="javascript:void(0);" onclick="select();" 
                            style="font-size: small; background-color: #FFFFFF">
                            &#1048;&#1079;&#1084;&#1077;&#1085;&#1080;&#1090;&#1100; &#1082;&#1086;&#1076; &#1080; &#1087;&#1088;&#1080;&#1084;&#1077;&#1095;&#1072;&#1085;&#1080;&#1077;</a>
        </div>
        <div style="float:left; width: 639px;" align="center">
        <asp:Menu ID="Menu2" runat="server" Orientation="Horizontal" Width="521px" MaximumDynamicDisplayLevels="0"
            StaticSelectedStyle-CssClass="StaticSelectedStyle" Height="32px" StaticSubMenuIndent="18px"
            OnMenuItemClick="Menu2_MenuItemClick">
            <StaticSelectedStyle CssClass="StaticSelectedStyle"></StaticSelectedStyle>
            <Items>
                <asp:MenuItem Text="&#1063;&#1072;&#1089;&#1086;&#1074;&#1099;&#1077;" Value="1" />
                <asp:MenuItem Text="&#1057;&#1091;&#1090;&#1086;&#1095;&#1085;&#1099;&#1077;" Value="2"
                    Selected="True" />
            </Items>
        </asp:Menu>
        </div>
    </div>

Answer 2

Is this the sort of ting your looking for?

<div id="nav-main" style=" width: 100%; min-width: 900px; border:1px solid green;">
  <div style="min-width:258px; min-width:30%;  float: left; background-color:#CCC;"> <a href="javascript:void(0);" onclick="select();" 
                            style="font-size: small;"> &#1048;&#1079;&#1084;&#1077;&#1085;&#1080;&#1090;&#1100; &#1082;&#1086;&#1076; &#1080; &#1087;&#1088;&#1080;&#1084;&#1077;&#1095;&#1072;&#1085;&#1080;&#1077;</a></div>
  <div style="float: left; background-color:#FFFFCC; width:70%;">
    <asp:Menu ID="Menu2" runat="server" Orientation="Horizontal" Width="521px" MaximumDynamicDisplayLevels="0"
            StaticSelectedStyle-CssClass="StaticSelectedStyle" Height="32px" StaticSubMenuIndent="18px"
            OnMenuItemClick="Menu2_MenuItemClick">
      <StaticSelectedStyle CssClass="StaticSelectedStyle"></StaticSelectedStyle>
      <Items>
        <asp:MenuItem Text="&#1063;&#1072;&#1089;&#1086;&#1074;&#1099;&#1077;" Value="1" />
        <asp:MenuItem Text="&#1057;&#1091;&#1090;&#1086;&#1095;&#1085;&#1099;&#1077;" Value="2"
                    Selected="True" />
      </Items>
    </asp:Menu>
    right</div>
  <div style="clear:both;"></div>
</div>