romario0403

подчеркивание строки независимо от наличия текста

Рекомендованные сообщения

доброе время суток, товарищи!

задача в общем описана в названии темы, только _Ианов___ тоже должен быть подчеркнут, не могу понять как это сделать :blink:

есть бланк в нем есть как однострочные поля, так и многострочные. я пробовал засовывать текст в div с border-top'ом, но оно некатит в многострочных полях :(

помогите кто чем может плиз

Изменено пользователем romario0403

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Может быть так?


<input type="text" value="Иванов" border="0" style="border-bottom:1px solid #000;"/>

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Можно сделать еще так


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css" >
#pbox {
margin: 20px 0 0;
border-top: 1px solid black;
}
p {
position: relative;
display: inline-block;
margin: -15px 0 0 10px;
padding: 0 5px;
background: #ffffff;
}
</style>
</head>
<body>
<div id="pbox" >
<p>Text text</p>
</div>
</body>
</html>

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

http://jsfiddle.net/CnZQ2/

Как вариант. Но тут будут блоками все элементы, не для каждого случая подойдёт. Зато можно управлять ориентацией текста, например так:

http://jsfiddle.net/CnZQ2/1/

Ну и наконец, побалуемся с внешним видом ))

http://jsfiddle.net/CnZQ2/9/

Изменено пользователем ViStefan

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

немного не то..если текст не влезает на одну строку, то подчеквивается только последняя, будь то <p>,<div>,<h*> или любой другой блочный элемент.

решил так:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css" >
body {
line-height:20px;
}
#str1 {
position:relative;
float:left;
z-index:1;
}
#str2 {
position:relative;
margin-left:53px;
font-size:16px;
background-image:url('http://deadmopo3.ru/u.gif');
}
#page {
width:640px;
}
</style>
</head>
<body>
<div id="page">
<div>
<div id="str1"><b>ФИО:</b></div>
<div id="str2">текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст текст  </div>
</div>
<br>
<div>
</body>
</html>

вот живой пример: http://deadmopo3.ru/u_text.php

всем спасибо за помощь! :)

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Статистика пользователей

    46 180
    Всего пользователей
    3 128
    Рекорд онлайна
    evgengold
    Новый пользователь
    evgengold
    Регистрация
  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.