2015-07-25 2 views
1

Я пытаюсь разработать простое приложение, как показано на изображении [! [Введите описание изображения здесь] [1]] [1]Как установить границу или отступы 0px между столбцами?

Но я столкнулся несколько вопросов в этой

  • На самом деле с помощью отступы : 0px и margin: 0px удалите пробел между столбцами. Но первый столбец и последний столбец имеют некоторый запас. В другом первом столбце и последнем столбце осталось немного полей. Но мне нужно, чтобы он столкнулся с супер div, как показано на изображении.
  • Как показать флажок справа от каждого столбца? Я могу показать значок, но у него есть два вопроса: он черный, он показывает левую сторону.
  • Как текст горизонтально расположен в центре, как показано на рисунке, или обертывать текст с равным краем справа и слева? Я не получаю текст по горизонтали. вот мой plunker

http://plnkr.co/edit/kEplF4kXjIkRRmxNzsVb?p=preview

Пожалуйста, проверьте код, используя предварительный кнопку (полный экран).

.answer_div .col{ 
    padding:0px; 
    margin:0px; 
} 

ответ

1

В классе «строка» css есть дополнение. Вот почему ваши внешние столбцы расположены на внутренней стороне - заполнение не находится в столбцах (вы удалили это правильно), это на внешнем div, имеющем класс «строка».

Для галочки вы можете использовать поплавок, чтобы получить его с правой стороны.

Для центрирования текста просто введите его в Google. Хит 1 уже сделал это для меня.

1

Чтобы сделать текст в центр

.answer_block{ 
    border:1px solid grey; 
    padding:20px; //added this 
    width:100%; 
    height:150px; 
    background-color:lightgrey; 

} 

Для того, чтобы галочка права и цвета белых использовать этот

.ion-checkmark 
{ 
    color:white; 
    font-size: 16px; 
    float:right; 
} 
Смежные вопросы