Не знаете, почему Div не плавает вправо

У меня проблема с конкретным div, который не будет плавать вправо. Я попытался удалить div и другие способы, и все же он все еще не работает.Не знаете, почему Div не плавает вправо

Вот следующий CSS и HTML-код, который я использую:

CSS:

  #sidebarright{ 
       float: right; 
       width: 30%; 
       padding: 0; margin:0; 
       padding-top: 20px; 
      } 

    .resstyle{ 
    font-size: 18px !important; 
    font-weight:bold; 
       margin: 0 0 7px 0; 
       padding-left: 20px; 
      } 
    #wrapper { 
    width: 940px; 
    height:100%; 
    margin: 0 auto; 
    } 
    #banner-wrapper{ 
     display:block; 
     padding:0; 
     margin-left:auto; 
     margin-right:auto; 
     background:#FFF; 
     background-image: url(./img/Banner.jpg); 
     height:14.6%; 
     padding-bottom:44px; 
    } 


HTML: 

    <div id="wrapper"> 

     <!-- banner-wrap starts here --> 
     <div id="banner-wrapper">          
        <!-- Menu Tabs --> 

       <ul> 
        <li class="navbar-buttons"><a href="index.cfm"><span>Home</span></a>&nbsp;<span style="color:white !important">|</span>&nbsp;<a href="Support.cfm"><span>Support</span></a></li> 

       </ul> 
     </div> 

     <div id="sidebarright"> 
      <a href="#"><img class="button" src="img/Pro.jpg" alt="Pro" /></a> 
      <div class="resstyle">Resources</div>  
     </div> 
    </div> 

UPDATE: 

<!---Temporary styling, to test---> 
<style> 
.img-banner{ 
    margin-left:auto; 
    margin-right:auto; 
    display:inline; 
} 

body{ 
    position:relative; 
    background-color:white; 
    margin: 0; 
    padding: 0; 
} 

ul{ 
    list-style:none; 
} 

a{ 
    color: white; 
    text-decoration: none; 
    font-family: Sherwood !important; 
} 

.navbar-buttons{ 
    padding-top:20px; 
    padding-right:20px; 
    text-align:right; 
    list-style:none; 
    margin:0 auto; 
    overflow:hidden; 
    <!---background-image: url(./img/Banner.jpg);---> 
} 

#wrapper { 
    width: 940px; 
    height:100%; 
    margin: 0 auto; 
} 

#banner-wrapper{ 
    display:block; 
    padding:0; 
    margin-left:auto; 
    margin-right:auto; 
    background:#FFF; 
    background-image: url(./img/Banner.jpg); 
    height:14.6%; 
    padding-bottom:44px; 
} 

img.no-border{border: 0;} 

.img-banner{ 
    margin-left:auto; 
    margin-right:auto; 
    display:block; 
} 

<!---/**********************Left Side of Page****************************/---> 
#sidebarleft{ 
    width: 30%; 
    padding-top:30px; 
    padding-right: 20px; 
    display:inline; 
    float:left; 
} 

#sidebarleft ul.menu{ 
    list-style:none; 
    padding:0; 
    margin:10px 0 10px 0; 
} 

.leftbuttons1{ 
    background-image: url(./img/Button_1.jpg); 
    background-repeat:no-repeat; 
    padding: 5px 10px 10px; 
} 

.leftbuttons1 a{ 
    color:grey; 
    font-size:10pt !important 
} 

.leftbuttons{ 
    background-image: url(./img/Button_1.jpg); 
    background-repeat:no-repeat; 
    padding: 5px 0 10px 10px; 
} 

.leftbuttons a{ 
    color:grey; 
    font-size:10pt !important 
} 

.leftbuttons2{ 
    background-image: url(./img/Button_2.jpg); 
    background-repeat:no-repeat; 
    padding: 7px 0 10px 7px; 
} 

.leftbuttons2 a{ 
    color:grey; 
    vertical-align:center; 
    font-size: 10pt !important; 
} 
    <!---/**************************************************/---> 

<!---/***********************Right Side of Page***************************/---> 
#sidebarright{ 
    float: right; 
    width: 30%; 
    padding: 0; margin:0; 
    padding-top: 20px; 
} 
<!---/**************************************************/---> 

img.buttonUlti{ 
    float:right; 
    padding-top:30px; 
    padding-bottom:15px; 
    border-radius:18px; 
} 

.shiftRes{ 
    margin-left:27px; 
    padding-top:40px; 
} 

.departstyle{ 
    font-size: 18px !important; 
    font-weight:bold; 
    padding-left: 10px; 
    margin: 0 0 7px 0; 
    padding-top: 17px; 
} 

.resstyle{ 
    font-size: 18px !important; 
    font-weight:bold; 
    margin: 0 0 7px 0; 
    padding-left: 20px; 
} 
</style> 

<div id="wrapper"> 

    <!-- banner-wrap starts here --> 
    <div id="banner-wrapper">          
       <!-- Menu Tabs --> 

      <ul> 
       <li class="navbar-buttons"><a href="index.cfm"><span>Home</span></a>&nbsp;<span style="color:white !important">|</span>&nbsp;<a href="Resources.cfm"><span>Support</span></a></li> 

      </ul> 
    </div> 

    <div id="sidebarright"> 
     <a href="https://n11.ultipro.com/logout.aspx"><img class="buttonUlti" src="img/Pro.jpg" alt="Pro" /></a> 
     <div class="resstyle">Resources</div>  
    </div> 

<div id="sidebarleft"> 
     <ul class="menu"> 
      <li class="departstyle">Departments</li> 
      <li class="leftbuttons1"><a href="#">Claims</a></li> 
      <li class="leftbuttons"><a href="#.cfm?">Credentialing</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Customer Services</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Data Management</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Decision Support</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Employee Services</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Finance</a></li> 
      <li class="leftbuttons"><a href="#.cfm">HCC</a></li> 
      <li class="leftbuttons2"><a href="#.cfm">Health System <br />Engagement and<br /> Contracting</a></li> 
      <li class="leftbuttons"><a href="#.cfm" target="_blank">Mail Room</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Marcom</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Medical Management</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Network Management</a></li> 
      <li class="leftbuttons"><a href="#.cfm">NextGen</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Operations</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Physician Resources</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Provider Relations</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Quality Management</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Quality Improvement</a></li> 
      <li class="leftbuttons"><a href="#.cfm">Risk Management</a></li>    
     </ul> 
</div>

Любая помощь будет оценена, спасибо

источник

2016-06-23 Roberto Flores

ДИВ плывет к прямо здесь https://jsfiddle.net/mqnt4fxg/ –

@HunterTurn er Я вижу, что на jsfiddle, который вы предоставили, я не понимаю, почему в конце концов он не работает –

Вы ищете что-то вроде этого: https://jsfiddle.net/gy4bd905/2/ –

Итак, с вашим обновленным кодом ваш css не применяется, потому что комментарии, которые вы используете, неверны для css. Вы используете HTML комментарии в CSS вместо соответствующего /* this is a comment */

Не Действительный:

<!---/**************************************************/--->

Действительно:

/**************************************************/

JSFiddle

источник

2016-06-23 17:32:57

Я нахожусь на cfm (Coldfusion, который я все еще пытаюсь выяснить, как применить файл css к файлу cfm), и поэтому я использую эти комментарии, однако вы правы и это сработало. Благодарю вас, немой из-за отсутствия –

Если вы хотите, чтобы плавать право из #banner-wrapper, вы должны также плавать, что один (поплавок: левый ) and give it ширина: 70% `(и удалить автоматические поля), чтобы они соответствовали друг другу:

http://codepen.io/anon/pen/gMLVKV

источник

2016-06-23 16:57:53 Johannes

Я не хочу плавать с баннера, но из-под баннера и ресурсов и кнопки, которые будут следовать, чтобы плавать вправо, но они не –

Собственно, первая скрипка, что Хантер Тернер сделал. Не уверен, почему он не работает –

Но это то, что он делает уже (в вашем коде) -? – Johannes

Не знаете, почему Div не плавает вправо

ответ

Смежные вопросы