У меня есть html-страница, которая выглядит следующим образом:
Я хочу отобразить текст на левой панели, но проблема в том, что текст должен быть внутри области только овальной формы. Как мне это достичь? Обратите внимание, что изображение в овальной форме является фоновым изображением, однако при необходимости я также могу использовать тег <img>
, если это поможет. Один из способов - использовать теги <p>
с дополнением, но это не эффективный способ, поэтому любезно предложите несколько хороших методов.
EDIT: HTML:
<div id="leftStage" class="rounded-corners">
<div id="questionDisp" align="center">
</div>
</div>
CSS:
#leftStage {
position: relative;
width: 34%;
height:86%;
float: left;
}
#questionDisp {
display:none;
}
JS:
(Когда вызывается соответствующая функция:)
$("#questionDisp").fadeIn(1000);
$("#questionDisp").html(quesArr.q1); //data read from xml
EDIT: мне нужен div или что-то выше овального фона, и текст должен поместиться в нем. Я получаю текст из XML файла, поэтому я не имею фиксированного размера текста, который будет отображаться