html positioning - текст перекрывается другим текстом

Чтобы получить то, что я хочу, мне нужно сделать еще один элемент ul или можно сделать это с помощью одного?html positioning - текст перекрывается другим текстом

код ниже:

HTML

<body> 
    <p> 
     <b>text</b>text<br /> 
     <b>text</b>text<br />    
     <b>text</b>text<br /> 
     <b>text</b> 
    </p> 
    <ul> 
     <li>text</li> 
     <li>text</li> 
     <li>text</li> 
    </ul> 
    <p> 
     <b>text</b>text<br /> 
     <b>text</b>text<br />     
     <b>text</b>text<br /> 
     <b>text</b> 
    </p> 
    <ul> 
     <li>text</li> 
     <li>text</li> 
    </ul> 
</body>

источник

2016-08-05 D0nK3Y_D0nK

Привет @ D0nK3Y_D0nK, не могли бы вы ответить на приведенные ниже ответы? Это сработало для вас? – kukkuz

Может быть, это работает для вас:

обернуть ul в DIV:

<div class="list"> 
    <ul> 
     <li>text</li> 
     <li>text</li> 
    </ul> 
    </div>

и в CSS:

.list { 
    text-align: right; 
    margin-right: 50px; 
} 
ul { 
    display: inline-block; 
}

сниппета приведены ниже:

p { 
 
    text-align: left; 
 
    margin: 50px; 
 
    line-height: 15px; 
 
} 
 
.list { 
 
    text-align: right; 
 
    margin-right: 50px; 
 
} 
 
ul { 
 
    display: inline-block; 
 
} 
 
body { 
 
    margin: 0; 
 
    padding: 0; 
 
    text-align: center; 
 
    font-family: Verdana, Arial, sans-serif; 
 
    font-size: 12px; 
 
    color: black; 
 
    background: white; 
 
    width: 100%; 
 
}

<body> 
 
    <p> 
 
    <b>text</b>text 
 
    <br /> 
 
    <b>text</b>text 
 
    <br /> 
 
    <b>text</b>text 
 
    <br /> 
 
    <b>text</b> 
 
    </p> 
 
    <div class="list"> 
 
    <ul> 
 
     <li>text</li> 
 
     <li>text</li> 
 
     <li>text</li> 
 
    </ul> 
 
    </div> 
 
    <p> 
 
    <b>text</b>text 
 
    <br /> 
 
    <b>text</b>text 
 
    <br /> 
 
    <b>text</b>text 
 
    <br /> 
 
    <b>text</b> 
 
    </p> 
 
    <div class="list"> 
 
    <ul> 
 
     <li>text</li> 
 
     <li>text</li> 
 
    </ul> 
 
    </div> 
 
</body>

источник

2016-08-05 03:46:05 kukkuz

Просто используйте HTML.

<p> 
    <b>text</b>text<br /> 
    <b>text</b>text<br />    
    <b>text</b>text<br /> 
    <b>text</b> 
</p> 
    <li>text</li> 
    <li>text</li> 
    <li>text</li> 
<p> 
    <b>text</b>text<br /> 
    <b>text</b>text<br />     
    <b>text</b>text<br /> 
    <b>text</b> 
</p> 
    <li>text</li> 
    <li>text</li>

И CSS.

p { 
    text-align: left; 
    margin:50px; 
    line-height:15px; 
} 
body { 
    margin: 0; 
    padding: 0; 
    text-align: center; 
    font-family: Verdana, Arial, sans-serif; 
    font-size: 12px; 
    color: black; 
    background: white; 
    width:100%; 
} 

li{ 
    text-align:right; 

}

источник

2016-08-05 01:55:37

Спасибо за ваш ответ. Когда я попробовал то, что вы предложили, сделав то, что я хочу, но его слишком далеко (http://imgur.com/qxTJ0Hd), как бы я поместил его более правильно? Благодарю. –

Простая настройка для тега UL в вашем CSS должен сделать трюк.

CSS:

ul { 
    position: relative; 
    right: 40px; /* Adjust number to push away from the right side */ 
    float: right; 
    list-style-type: disic; 
    margin: 10px; 
    padding: 0; 
    line-height: 15px; 
}

See jfiddle here

источник

2016-08-05 06:21:10 TGEE

html positioning - текст перекрывается другим текстом

ответ

Смежные вопросы