overflow: hidden и текст

maxs · August 18, 2009

Хотелось бы чтобы при "overflow: hidden" не обрезался текст за пределами блока, а просто не показывало строку вообще. Как это сделать можно?

Edited August 18, 2009 by maxs

psywalker · August 18, 2009

Хотелось бы чтобы при overflow: hidden не обрезался текст за пределами блока, а просто не показывало, всё что не полностью помещается. Как это сделать можно?

А это не одно и тоже?

maxs · August 18, 2009

просто когда только верх слова видно - не красиво

psywalker · August 18, 2009

Боюсь, что не получится, а покажи ситуацию

maxs · August 18, 2009

вот о чем речь

psywalker · August 18, 2009

Сделай у абзаца отступ нижний, что-бы он не позволял резать строки

Edited August 18, 2009 by psywalker

maxs · August 18, 2009

так а отступ от чего? вот класс

.b2 {

width: 258px;

height:330px;

float:left;

margin: 10px;

padding: 10px;

border: 1px solid #E6E6E6;

background: #F7F7F7;

overflow: hidden;

position: relative;

}

вот вроде код

<div class="b2">
<h2><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title() ?></a></h2>
<p class="meta"> <?php the_time(' j F Y'); ?> · <a href="<?php the_permalink(); ?>#comments"><?php comments_number('Пока нет комментариев', ' Есть 1 комментарий', 'Есть % коммент.'); ?></a></p>
<?php the_content('Далее');?>
</div>

Edited August 18, 2009 by maxs

psywalker · August 18, 2009

тогда Два варианта, либо расчитай высоту, чтобы совпадала на строке, а не на полустроке при обрезании, либо вообще убери высоту

maxs · August 18, 2009

в блоке всё время разные записи, так конечно бы изменил высоту и всё

и убирать совсем высоту нельзя, так как когда запись ещё вверху, то там должно много текста отображаться, а потом когда опускается - мало

psywalker · August 18, 2009

Ну тогда не знаю, сделай так:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.b2 {
width: 258px;
float:left;

margin: 10px;
padding: 20px;
border: 1px solid #E6E6E6;
background: #F7F7F7;
position: relative;

}
.b { padding: 10px; overflow: hidden; height: 230px;}
</style>
</head>

<body>
<div class="b">
<div class="b2">
<h2><a href="#">fsdfa</a></h2>
<p class="meta" >
	gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg	gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
		gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg	gdfgdfsgsggdfsgsggdfsgsggdfsgsg gdfsgsgsgsg
	gdfsgsg
</p>

</div>
</div>
</body>
</html>

maxs · August 18, 2009

Спасибо, вроде что-то такое получилось, но хвосты от букв типа "б" торчат, пробовал менять паддинги по разному - не помогает.

очень это странно, каким образом подравнялись строки не могу понять, вроде расстояние между ними осталось такое же, судя по торчащим обрубкам некоторых букв, может просто совпало, из-за добавления ещё одного дива, а по сути ничего не поменялось

Edited August 18, 2009 by maxs

psywalker · August 18, 2009

Спасибо, вроде что-то такое получилось, но хвосты от букв типа "б" торчат, пробовал менять паддинги по разному - не помогает.
очень это странно, каким образом подравнялись строки не могу понять, вроде расстояние между ними осталось такое же, судя по торчащим обрубкам некоторых букв, может просто совпало, из-за добавления ещё одного дива, а по сути ничего не поменялось

Я тебе сразу сказал, что бы ты высоту подобрал нужную, я у себя делал, у меня получилось, так что давай дуй учиться

maxs · August 18, 2009

высоту нельзя подобрать, сегодня совпало, завтра новый пост опять всё собьет

как это делается на серьезных сайтах, вот в чем вопрос

Edited August 18, 2009 by maxs

mini · August 18, 2009

text-indent:-9999px; не то?

maxs · August 19, 2009

text-indent:-9999px; не то?

забавно конечно, но не то

Justnewone · August 19, 2009

забавно конечно, но не то

Если содержание всегда текст одинакового размера - дайте тогда высоту в em.

Sign In

overflow: hidden и текст

Question

Link to comment

Share on other sites

15 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information