Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.01.2013, 16:43
Новичок на форуме
Отправить личное сообщение для Aridon Посмотреть профиль Найти все сообщения от Aridon
 
Регистрация: 20.01.2013
Сообщений: 6

Добавление пожелания на страницу.
Вообщем такая ситуация, все работает. НО, как заставить вновь добавленное пожелание размещаться строго в рамках <div>'а. Получается, что добавляется 1ой строкой.
<body>
<div id="mainDiv">
<div id="head">Оставьте свое пожелание:</div>
<div id="middle"><form>
                    <textarea id="Text" wrap="hard" ></textarea>
                    </form><br />
                    <button>ADD</button>
</div>
<div id="footer"></div>
</div>
</body>


$(document).ready(function() {
    $('button').click(function(){
        var text = $('#Text').val();  
        $('#footer').append('<div id="newDiv"><p class="newClass">'+ text +'</p></div>');
        
});
});



CSS:
body{
    width:600px;
    margin:auto;
    border-left: 1px solid silver;
    border-right: 1px solid silver;
}
#mainDiv{
    padding: 10px 40px 10px 40px;
}

#newDiv{
    border:1px solid black;
    display: inline-block;
    width: 150px;
    height: 150px;
    margin:10px;
   
    
}
.newClass{
    color:red;
    font-size:10px;
    width: 150px;
    padding: 10px;
}
Ответить с цитированием
  #2 (permalink)  
Старый 20.01.2013, 16:50
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

пробуйте так:
$('#footer').append('<div id="newDiv"><p class="newClass"><pre>'+ text +'</pre></p></div>');
Ответить с цитированием
  #3 (permalink)  
Старый 20.01.2013, 17:14
Новичок на форуме
Отправить личное сообщение для Aridon Посмотреть профиль Найти все сообщения от Aridon
 
Регистрация: 20.01.2013
Сообщений: 6

Все так же отображает строку на весь блок. Не могу понять из-за чего, ширину указал..
И еще если пустую строку добавлять - новый блок смещается.
Ответить с цитированием
  #4 (permalink)  
Старый 21.01.2013, 08:12
Аватар для ОлегА
Профессор
Отправить личное сообщение для ОлегА Посмотреть профиль Найти все сообщения от ОлегА
 
Регистрация: 25.08.2011
Сообщений: 420

#newDiv{
    border:1px solid black;
    display: inline-block;
    width: 150px;
    height: 150px;
    margin:10px;
    word-wrap: break-word;     
}
Ответить с цитированием
  #5 (permalink)  
Старый 21.01.2013, 16:14
Новичок на форуме
Отправить личное сообщение для Aridon Посмотреть профиль Найти все сообщения от Aridon
 
Регистрация: 20.01.2013
Сообщений: 6

не работает.
Буду признателен, если поможете написать корректный, работающий код
Ответить с цитированием
  #6 (permalink)  
Старый 21.01.2013, 17:17
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Aridon,
Дайте ссылку на тестовую страницу с траблом, на скриншоте укажите где-что не так
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Написать скрипт, создающий ссылку на страницу, находящуюся на вашем сервере. Ирина Владимировна Общие вопросы Javascript 1 28.03.2012 19:02
Скрипт отслеживающий подгрузку контента на страницу. psqs Events/DOM/Window 2 23.01.2012 20:29
Скрипт счетчика тормозит когда вделаю страницу активной denisOgr jQuery 1 30.10.2011 15:15
Запись данных в страницу с сохранением. integer Элементы интерфейса 26 18.02.2011 13:07
Добавление нужного css-файла в html страницу в зависимости от ширины окна браузера UglyDemon Общие вопросы Javascript 1 24.12.2010 10:30