2016-07-02 2 views
0

Его не только divs. Списки также не останутся в очереди. Я уже много пробовал и не могу заставить его работать. (дисплей: встроенный на все и создание ширины обертки 100%). Это что-то нормальное для хром-расширений? Вот мой html, надеюсь, вы сможете помочь. Благодаря!Дивы не останутся встроенным хромированным удлинителем

<!-- 
<!doctype html> 
This page is shown when the extension button is clicked, because the 
"browser_action" field in manifest.json contains the "default_popup" key with 
value "popup.html". 
--> 
<html> 
    <head> 
    <title>Minds radio</title> 
    <style> 
html, body { 
margin:0; 
padding:0; 
overflow-y: hidden; 
width: 900; 
height: 1100; 
display: inline; 
font-family: "Segoe UI", "Lucida Grande", Tahoma, sans-serif; 
font-size: 100%; 
background-color: white; 
width: 900; 
} 
     #status { 
     /* avoid an excessively wide status text */ 
     white-space: pre; 
     text-overflow: ellipsis; 
     } 
    p{ 
      visibility:visible; 
    } 

a { 
color: #5882C4; 
} 
.footer { 
display: inline !important; 
width: 100%; 
} 
.bloc { 
padding: 20; 
display: inline; 
background-color: black; 
} 
    </style> 

    <!-- 
     - JavaScript and HTML must be in separate files: see our Content Security 
     - Policy documentation[1] for details and explanation. 
     - 
     - [1]: https://developer.chrome.com/extensions/contentSecurityPolicy 
    --> 
    </head> 
    <body> 
    <div id="status"> 
<center> 
<img width="260" height="170" src="http://themindspanel.com/wp-content/uploads/2016/06/mindsradio3-1200x500.jpg" alt="mindsradio3" /></a> 
<center><iframe src="https://mindsradio.airtime.pro/embed/player?stream=auto&amp;title=Minds Radio" width="280" height="216" frameborder="0"></iframe></center> 
</center> 
<div class="footer" style="display: inline !important; width: 100%;"> 
    <div><a href="index.html" class="bloc">Radio</a></div> 
    <div><a href="schedule.html" class="bloc">Schedule</a></div> 
    <div><a href="donate.html" class="bloc">Donate</a></div> 
    <div><a href="mindsPanel.html" class="bloc">M-P</a></div> 
</div> 

</body> 
</html> 

ответ

1

Добавить мин-ширина:

<!-- 
<!doctype html> 
This page is shown when the extension button is clicked, because the 
"browser_action" field in manifest.json contains the "default_popup" key with 
value "popup.html". 
--> 
<html> 
    <head> 
    <title>Minds radio</title> 
    <style> 
html, body { 
margin:0; 
padding:0; 
overflow-y: hidden; 
width: 900px; 
height: 1100; 
display: inline-block; 
font-family: "Segoe UI", "Lucida Grande", Tahoma, sans-serif; 
font-size: 100%; 
background-color: white; 
} 
     #status { 
     /* avoid an excessively wide status text */ 
     white-space: pre; 
     text-overflow: ellipsis; 
     } 
    p{ 
      visibility:visible; 
    } 

a { 
color: #5882C4; 
} 
.footer { 
display: inline-block !important; 
width: 100%; 
} 
.bloc { 
padding: 20; 
display: inline-block; 
background-color: black; 
min-width:200px 
} 
    </style> 

    <!-- 
     - JavaScript and HTML must be in separate files: see our Content Security 
     - Policy documentation[1] for details and explanation. 
     - 
     - [1]: https://developer.chrome.com/extensions/contentSecurityPolicy 
    --> 
    </head> 
    <body> 
    <div id="status"> 
<img width="260" height="170" src="http://themindspanel.com/wp-content/uploads/2016/06/mindsradio3-1200x500.jpg" alt="mindsradio3" /></a> 
<center><iframe src="https://mindsradio.airtime.pro/embed/player?stream=auto&amp;title=Minds Radio" width="280" height="216" frameborder="0"></iframe></center> 
</center> 
<div class="footer" width: 100%;"> 
    <span><a href="index.html" class="bloc">Radio</a></span> 
    <span><a href="schedule.html" class="bloc">Schedule</a></span> 
    <span><a href="donate.html" class="bloc">Donate</a></span> 
    <span><a href="mindsPanel.html" class="bloc">M-P</a></span> 
</div> 

</body> 
</html> 
+0

Он по-прежнему не работало. Он рассеивается дальше. – user6333114

+0

Ширины, которые вы используете, являются реальной проблемой. Покажи нам скрипку. –

+0

'display: inline-block' и' min-width: 200px'. –

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