Архивировано

Эта тема находится в архиве и закрыта для публикации сообщений.

  • 0
romario0403

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

Вопрос

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

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

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

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

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


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

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

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

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


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

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


<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/

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


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

немного не то..если текст не влезает на одну строку, то подчеквивается только последняя, будь то <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

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

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


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