Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
MySQL на примерах. Авторы: Кузнецов М.В., Симдянов И.В. PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. Программирование. Ступени успешной карьеры. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. Социальная инженерия и социальные хакеры. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум (новые сообщения вниз) Структурный форум

тема: Класс CSS

Сообщения:  [1-10]   [11-12] 

 
 автор: сотка   (08.10.2012 в 16:45)   письмо автору
 
   для: сотка   (21.09.2012 в 18:36)
 

решил проблему табличной версткой и дополнительным классом !

  Ответить  
 
 автор: сотка   (21.09.2012 в 18:36)   письмо автору
20.6 Кб
 
   для: ЯСА   (20.09.2012 в 21:03)
 

Таким образом (только шрифт и цвет оставить прежним) так как в одну строку уместить длинный текст не реально !

  Ответить  
 
 автор: ЯСА   (20.09.2012 в 21:03)   письмо автору
 
   для: сотка   (20.09.2012 в 20:39)
 

как-то непохоже выложенное вами на мою просьбу "нарисовать", не находите?

вы всегда, когда вас просят спеть, танцуете?
и, наоборот, когда просят станцевать, вы поёте?

когда просят НАРИСОВАТЬ - это значит надо именно НАРИСОВАТЬ (в каком-то графическом редакторе, типа Paint), а не выкладывать сюда огромные бестолковые коды...

  Ответить  
 
 автор: сотка   (20.09.2012 в 20:39)   письмо автору
 
   для: ЯСА   (20.09.2012 в 20:29)
 

нужно чтобы текст не выходил за рамки как я понимаю 400 px

  Ответить  
 
 автор: сотка   (20.09.2012 в 20:38)   письмо автору
 
   для: сотка   (20.09.2012 в 20:36)
 

исходный код

<!DOCTYPE html>
<html>
  <head>
     <meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=yes" />
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="MobileOptimized" content="176" />
    <meta name="format-detection" content="telephone=no" />
    <title></title>
    <meta name="keywords" content=""/>
    <link rel="shortcut icon" href="favicon.png" type="image/x-icon" />
    <link rel="stylesheet" href="style.css" type="text/css" />
    <script type="text/javascript" src="js/mootools.svn.js"></script>
    <script>
        window.addEvent('domready', function(){
            var mySlide = new Fx.Slide('v-menu3');
            mySlide.hide();
            $('toggle3').addEvent('click', function(e){
                e = new Event(e);
                mySlide.toggle();
                e.stop();
            });

        });

        window.addEvent('domready', function(){
            var mySlide = new Fx.Slide('v-menu2');
            mySlide.hide();
            $('toggle2').addEvent('click', function(e){
                e = new Event(e);
                mySlide.toggle();
                e.stop();
            });

        });

        window.addEvent('domready', function(){
            var mySlide = new Fx.Slide('v-menu');
            mySlide.hide();
            $('toggle').addEvent('click', function(e){
                e = new Event(e);
                mySlide.toggle();
                e.stop();
            });

        });
    </script>

    <script type="text/javascript" src="js/jquery-latest.pack.js"></script>
    <script type="text/javascript" src="js/jcarousellite_1.0.1.js"></script>
    <script>
    jQuery.noConflict();
    jQuery(function() {
    jQuery(".anyClass").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev",
        auto: 5000,
        speed: 500
    });
});
    </script>
    <script type="text/javascript" src="js/jcarousellite_1.0.2.js"></script>
    <script>
    jQuery.noConflict();
    jQuery(function() {
    jQuery(".anyClass2").jCarouselLite2({
        btnNext: ".next",
        btnPrev: ".prev",
        auto: 5000,
        speed: 500
    });
});
    </script>

</head>
<body>
<a href="#"><div class="logo"><img src="img/android.png" /></div></a>
<div class="topnav radiustop">
    <a href="../index.php">Главная</a>
    <div class="toprazd"></div>
    <a href="index.php">Андройды</a>
   
</div>

 <div class="link radiustop">
 <table border="0" align="center">
        <tr width="100%">
            <td width="30%">  </td>   <a href='/android/article.php?page=2&amp;id_catalog=8'><span class="button radiusfull"> Вперед</span></a>&nbsp;&nbsp;  <a href='/android/article.php?page=2&amp;id_catalog=8'><span class="button radiusfull"> В&nbsp;конец</span></a>&nbsp;&nbsp;</td></tr></table></div><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=13&page=0"
                     ><div class="arrow" >Как&nbsp;сделать&nbsp;шрифты&nbsp;или/и&nbsp;размеры&nbsp;иконок&nbsp;больше?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=14&page=0"
                     ><div class="arrow" >Как&nbsp;перенести&nbsp;контакты&nbsp;из&nbsp;аккаунта&nbsp;телефона&nbsp;в&nbsp;аккаунт&nbsp;Google?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=15&page=0"
                     ><div class="arrow" >Как&nbsp;изменить&nbsp;метод&nbsp;ввода?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=16&page=0"
                     ><div class="arrow" >&nbsp;&nbsp;Как&nbsp;выбрать&nbsp;сторонний&nbsp;метод&nbsp;ввода&nbsp;(установленную&nbsp;вами&nbsp;клавиатуру)?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=17&page=0"
                     ><div class="arrow" >Невозможно&nbsp;установить&nbsp;защищенное&nbsp;соединение&nbsp;с&nbsp;сервером&nbsp;?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=18&page=0"
                     ><div class="arrow" >&nbsp;&nbsp;Как&nbsp;после&nbsp;полного&nbsp;сброса&nbsp;синхронизировать&nbsp;нужную&nbsp;мне&nbsp;часть&nbsp;данных&nbsp;с&nbsp;Google&nbsp;аккаунтом?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=19&page=0"
                     ><div class="arrow" >Как&nbsp;устанавливать&nbsp;приложения&nbsp;(apk)?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=20&page=0"
                     ><div class="arrow" >Как&nbsp;добавить&nbsp;виджет&nbsp;на&nbsp;рабочий&nbsp;стол?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=21&page=0"
                     ><div class="arrow" >&nbsp;&nbsp;Как&nbsp;устанавливать&nbsp;приложения&nbsp;на&nbsp;карту&nbsp;памяти?</div></div></a><div class="cat" style="padding-bottom: 10px;"><a href="/android/article.php?id_catalog=8&id_position=22&page=0"
                     ><div class="arrow" >&nbsp;&nbsp;Как&nbsp;импортировать&nbsp;контакты&nbsp;с&nbsp;SIM&nbsp;карты?</div></div></a>
<div align="center" style="padding: 5px;" class="link radiusbottom">
<div style="padding-bottom: 7px;" class="slider radiusfull">
<input placeholder="Что ищем?" name="" class="search radiusfull" />
<input type="button" class="button radiusfull" name="" value="Поиск" />
</div>
</div><br />
<a href="#"><div class="reklama radiustop">На правах рекламы</div></a>
<div class="link radiusfull">
<a href='http://wappc.biz/?uid=25502'><div class="starrek">Заработок&nbsp;wap&nbsp;мастерам</div></a>
<a href="#"><div class="starrek">Андройд&nbsp;маркет</div></a>
<a href="#"><div class="starrek">МОРЕ&nbsp;БЕСПЛАТНЫХ&nbsp;ЗАГРУЗОК**</div></a>
 <a href="http://pixeli.su/
go/1270"><img src="http://
pixeli.su/im/1270"
alt="pixeli.su"/></a> 
<script type="text/javascript" src="http://mobtop.ru/c/23591.js"></script><noscript><a href="http://mobtop.ru/in/23591"><img src="http://mobtop.ru/23591.gif" alt="MobTop.Ru - Рейтинг и статистика мобильных сайтов"/></a></noscript>

</div>

<div class="foot">© 2012 Ritlen.ru</div>

<!-- Yandex.Metrika counter -->
<script type="text/javascript">
(function (d, w, c) {
    (w[c] = w[c] || []).push(function() {
        try {
            w.yaCounter16853947 = new Ya.Metrika({id:16853947, enableAll: true});
        } catch(e) { }
    });
    
    var n = d.getElementsByTagName("script")[0],
        s = d.createElement("script"),
        f = function () { n.parentNode.insertBefore(s, n); };
    s.type = "text/javascript";
    s.async = true;
    s.src = (d.location.protocol == "https:" ? "https:" : "http:") + "//mc.yandex.ru/metrika/watch.js";

    if (w.opera == "[object Opera]") {
        d.addEventListener("DOMContentLoaded", f);
    } else { f(); }
})(document, window, "yandex_metrika_callbacks");
</script>
<noscript><div><img src="//mc.yandex.ru/watch/16853947" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->

</body>
</html>

  Ответить  
 
 автор: сотка   (20.09.2012 в 20:36)   письмо автору
 
   для: ЯСА   (20.09.2012 в 20:29)
 

стиль

body
{
    font-size: 10pt;
    font-family: tahoma, arial;
    max-width: 400px;
    background: #a8d2e5 url(img/bg.png) top repeat-x;
    margin: 0px auto;
    padding: 5px;
    cursor: default;
}

a
{
    text-decoration: none;
}

.radiustop
{
    border-radius: 10px 10px 0px 0px;
    -webkit-border-radius: 10px 10px 0px 0px;
    -khtml-border-radius: 10px 10px 0px 0px;
    -o-border-radius: 10px 10px 0px 0px;
    -ms-border-radius: 10px 10px 0px 0px;
    -icab-border-radius: 10px 10px 0px 0px;
}

.radiusbottom
{
    border-radius: 0px 0px 10px 10px;
    -webkit-border-radius: 0px 0px 10px 10px;
    -khtml-border-radius: 0px 0px 10px 10px;
    -o-border-radius: 0px 0px 10px 10px;
    -ms-border-radius: 0px 0px 10px 10px;
    -icab-border-radius: 0px 0px 10px 10px;
}

.radiusleft
{
    border-radius: 10px 0px 0px 10px;
    -webkit-border-radius: 10px 0px 0px 10px;
    -khtml-border-radius: 10px 0px 0px 10px;
    -o-border-radius: 10px 0px 0px 10px;
    -ms-border-radius: 10px 0px 0px 10px;
    -icab-border-radius: 10px 0px 0px 10px;
}

.radiusright
{
    border-radius: 0px 10px 10px 0px;
    -webkit-border-radius: 0px 10px 10px 0px;
    -khtml-border-radius: 0px 10px 10px 0px;
    -o-border-radius: 0px 10px 10px 0px;
    -ms-border-radius: 0px 10px 10px 0px;
    -icab-border-radius: 0px 10px 10px 0px;
}

.radiusfull
{
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    -o-border-radius: 10px;
    -ms-border-radius: 10px;
    -icab-border-radius: 10px;
}

.search
{
    border: 1px solid #cbdfe8;
    padding: 3px;
    padding-left: 8px;
    padding-right: 8px;
    color: #B6BFC7;
    width: 50%;    
}
.search:Focus
{
    outline: none;
}

.preview
{
    border: 2px solid #eaeaea;
    margin-left: 5px;
    margin-right: 5px;
}
.preview:hover
{
    border: 2px solid #cbdfe8;
}

.logo
{
    padding: 5px;
    text-align: left;
    display: inline-block;
}

.slider
{
    background: #f8fbfd url(img/logo.gif) repeat-x;
    padding: 10px;
    padding-bottom: 3px;
    text-align: center;
    color: #555555;
}
.slider p
{
    margin-top: 10px;
    margin-bottom: 10px;
}

.rating
{
    margin: 3px;
    margin-left: 0px;
}

.cat
{
    background: #f8fbfd url(img/logo.gif) repeat-x;
    padding: 10px;
    padding-bottom: 3px;
    text-align: center;
    color: #3990d8;
}
.cat a
{
    color: #3990d8;
}

.cat:hover
{
    background: #f5fafc url(img/topnav.gif) repeat-x;
    color: #8fcf12;
}

.toprazd
{
    background: url(img/toprazd.png) no-repeat;
    height: 24px;
    width: 2px;
    display: inline-block;
}

.topnav
{
    background: #f5fafc url(img/topnav.gif) repeat-x;
    padding: 10px;
    padding-top: 0px;
    text-align: center;
}
.topnav a
{
    color: #a8a8a8;
    text-decoration: none;
    padding: 8px;
}
.topnav a:hover
{
    color: #8fcf12;
}

.link
{
    background: #f5fafc url(img/topnav.gif) repeat-x;
    border-top: 1px solid #f5fafc;
    padding: 10px;
    color: #3990d8;
    font-size: 12px;
    font-weight: bold;
    display: block;
}
.link a
{
    color: #3990d8;
}

.open
{
    background: url(img/open.png) right no-repeat;
    width: 16px;
    height: 16px;
    padding-right: 96%;
    cursor: pointer;
    color: #3990d8;
}
.open:hover
{
    background: url(img/open_h.png) right no-repeat;
    width: 16px;
    height: 16px;
    padding-right: 96%;
}

.menuarrow
{
    background: url(img/menu_h.png) left no-repeat;
    width: 16px;
    height: 16px;
    padding-left: 20px;
}

.close
{
    background: url(img/close.png) right no-repeat;
    width: 16px;
    height: 16px;
    padding-right: 96%;
    cursor: pointer;
}
.close:hover
{
    background: url(img/close_h.png) right no-repeat;
    width: 16px;
    height: 16px;
    padding-right: 96%;
}

.starrek
{
    background: url(img/starrek.png) left no-repeat;
    width: 16px;
    height: 16px;
    padding: 5px;
    padding-left: 23px;
    display: block;
}
.starrek:hover
{
    background: url(img/starrek_h.png) left no-repeat;
    width: 16px;
    height: 16px;
}

.arrow
{
    background: url(img/arrow.png) right no-repeat;
    width: 16px;
    height: 16px;
    padding-right: 96%;
}
.arrow:hover
{
    background: url(img/arrow_h.png) right no-repeat;
    width: 16px;
    height: 16px;
    padding-right: 96%;
}

.size
{
    background: #97d237 url(img/green.gif) repeat-x;
    padding: 8px;
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff;
    text-decoration: none;
    border: 0px;
    outline: none;
    font-weight: normal;
    border-left: 1px solid #d1f2a3;
    display: inline-block; 
}

.download
{
    background: #3990d8 url(img/blue.gif) repeat-x;
    padding: 8px;
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff;
    text-decoration: none;
    border: 0px;
    outline: none;
    cursor: pointer;
    font-weight: normal;
    display: inline-block;
}
.download:hover
{
    background: #97d237 url(img/green.gif) repeat-x;
}

.button
{
    background: #3990d8 url(img/blue.gif) repeat-x;
    padding: 4px;
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff;
    text-decoration: none;
    border: 0px;
    outline: none;
    cursor: pointer;
    font-weight: normal;
    display: inline-block;    
    outline:none;
    outline-offset:-2px;    
}
.button:hover
{
    background: #97d237 url(img/green.gif) repeat-x;
}

.bluebg
{
    background: #3990d8 url(img/blue.gif) repeat-x;
    padding: 1px;
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff;
    text-decoration: none;
    font-size: 20px;
    border-left: 1px solid #61a7e0;
}
.bluebg:hover
{
    opacity: 0.8;
}

.bluebg a
{
    color: #ffffff;
    text-decoration: none;
}

.greenbg
{
    background: #97d237 url(img/green.gif) repeat-x;
    padding: 1px;
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff;
    text-decoration: none;
    font-size: 20px;
}
.greenbg:hover
{
    opacity: 0.8;
}

.greenbg a
{
    color: #ffffff;
    text-decoration: none;
}

.reklama
{
    background: #3990d8 url(img/blue.gif) repeat-x;
    padding: 3px;
    padding-left: 10px;
    padding-right: 10px;
    color: #ffffff;
    text-decoration: none;
    display: inline;
    position: relative;
    bottom: 3px;
    margin-left: 10px;
}
.reklama:hover
{
    opacity: 0.8;
}

ul.v-menu{padding:0; margin:0; list-style:none;}
.v-menu li{background: #f8fbfd url(img/logo.gif) repeat-x; padding:10px; margin:0; list-style:none;}
ul.v-menu{clear:both;}
.v-menu li a{display: block;color: #a8a8a8;}
.v-menu li a:hover{color: #8fcf12;}

.foot
{
    text-align: center;
    padding: 10px;
    color: #1d4b69;
}

@media (max-width: 330px) {
body
{
    font-size: 9pt;
    font-family: tahoma, arial;
    max-width: 400px;
    background: #a8d2e5 url(img/bg.png) top repeat-x;
    margin: 0px auto;
    padding: 5px;
    cursor: default;
}

.arrow
{
    padding-right: 92%;
}
.arrow:hover
{
    padding-right: 92%;
}
.link
{
    padding: 5px;
    font-size: 9pt;    
}
.slider
{
    padding: 5px;
    padding-bottom: 3px;
}
}

  Ответить  
 
 автор: ЯСА   (20.09.2012 в 20:29)   письмо автору
 
   для: сотка   (20.09.2012 в 18:12)
 

нарисуйте - что именно вы хотите получить

обязательно с размерами
которые делятся на фиксированные (точно в пикселях), относительные (в процентах от родителя) и т.н. "свободные" (как получится, в зависимости от внутреннего содержимого)

тогда будем думать

  Ответить  
 
 автор: сотка   (20.09.2012 в 18:12)   письмо автору
 
   для: ЯСА   (20.09.2012 в 18:08)
 

Тогда как поступить?

1 - убрать &nbsp; ?
получаем вообще наложение текста друг на друга

2- увеличить значения
width: 16px; 
    height: 16px;


?

  Ответить  
 
 автор: ЯСА   (20.09.2012 в 18:08)   письмо автору
 
   для: сотка   (20.09.2012 в 17:42)
 

как-то вы сильно изощрённо насилуете браузер - в ширину 16 пикселей пытаетесь втюхать длиннющий неразрывный тест - &nbsp;&nbsp;Как&nbsp;выбрать&nbsp;сторонний&nbsp;метод&nbsp;ввода&nbsp;(установленную&nbsp;вами&nbsp;клавиатуру)?

что за ужимки-то такие бредовые?

  Ответить  
 
 автор: сотка   (20.09.2012 в 17:58)   письмо автору
49.2 Кб
 
   для: Lelik   (20.09.2012 в 17:52)
 

тогда получается такое

  Ответить  

Сообщения:  [1-10]   [11-12] 

Форум разработан IT-студией SoftTime
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования