@Prow1er

Как сделать метку с текстом неизвестной длины в одну строку?

Пытаюсь сделать метку в виде текста. Текст должен быть на белом фоне и в рамке. Попытки приводят к тому, что div не растягивается под текст.
Как можно это победить?

Код вывода метки
var myPlacemark = ymaps.templateLayoutFactory.createClass(
     `<div class="placemark_layout_container"><div class="plant_caption">{{properties.name}}</div></div>`
);

ymaps.layout.storage.add('my#simplePlacemark', myPlacemark);
 data = {
       type: "FeatureCollection",
       features: [
            {
                  type: "Feature",
                  id: "0",
                  geometry: {
                  type: "Point",
                  coordinates: [
                        55.818948,
                        37.702706
                    ]
           },
           properties: {name: 'test name'},
           options: {
                 iconLayout: 'my#simplePlacemark',
           }
      }
   ]
}
gObjectManager = new ymaps.ObjectManager({});
 gObjectManager.add(data)
map.geoObjects.add(gObjectManager);

.placemark_layout_container {              
                position: relative;             
                font-family: Georgia;             
                font-size: 40px;             
                text-align: center;             
                font-weight: bold;         
}    
.plant_caption{
       border: 2px solid #218703;             
       background-color: white;             
       color: #218703;   
}

Результат:
61f3b7c158896683509925.jpeg
  • Вопрос задан
  • 68 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега CSS
Добавить блоку с текстом

white-space: nowrap;
position: absolute;

https://jsfiddle.net/b5koa7dm/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы