como poner imagen a borde?

polarubi · #1 (**permalink**) 26/08/2011, 13:33

hola que tal eh buscado por todos lados pero no consigo ponerle una imagen a mi borde, aca les muestro.

este es mio, lo que esta en verde es el borde

bueno y lo que deseo hacer es que me quede asi, el borde este son las de colores.

bueno le agradeceria cualquier ayuda, muchas gracias

IEKK · #2 (**permalink**) 26/08/2011, 14:25

Ayudaría a saber si lo que estás usando border y sus propiedades o sencillamente es un div de color verde.

El ejempo que muestras (2ª imagen) no creo que esté creado con las propiedades del boder ya que hasta donde yo sé, estas son las disponibles:

http://www.w3schools.com/css/css_border.asp

De todas formas usando un div sólo tienes que repetir en x la imagen.
Bien puedes diseñarla tu mismo (te lo recomiendo) o bien usar este tipo de páginas:

http://www.stripegenerator.com/index...tzaGFkb3c9MDs=

Después p.e algo así: ( a lo mejor ya lo sabes pero por si acaso )

Código CSS:

Ver originalheight:15px;
background: url('la ruta de la imagen') repeat-x;

Un saludo.

polarubi · #3 (**permalink**) 26/08/2011, 14:49

muchas gracias por tu pronta respuesta, yo en mi css tengo asi

#userlinks{
background: #8cc300;
border: 1px solid #8cc300;
height: 50px;
margin: 5px 0 5px 0;
padding: 0 5px 0 5px;
}

IEKK · #4 (**permalink**) 26/08/2011, 16:18

Casualidades de la vida encontré justo la url de esa imagen.
No sabía que la usaba Taringa.

Bueno a ver si esto te sirve de guía:

Código HTML:

Ver original<html>
 
<head>
 
<style type="text/css"> 
#borde{
margin:0 auto;
height:490px;
width:490px;
background:url('http://o2.t26.net/img/register-bg.gif');
padding:10px;
}
 
#contenido{
height:470px;
width:470px;
background:#FFF;
padding:10px;
}
 
</style>
 
</head>
 
<body>
<div id="borde">
    <div id="contenido">El contenido del div</div>
</div>
 
</body>
 
</html>

polarubi · #5 (**permalink**) 26/08/2011, 19:44

muchas gracias pero mira como me queda,

osea el borde de abajo no cierra, como que sigue de largo,

el css lo tengo asi

Código:

#borde{ 
margin:0 auto;
height:40px;
background:url('http://o2.t26.net/img/register-bg.gif');
padding:10px;
}
#contenido{
height:40px;
background:#FFF;
padding:10px;
}

saludos

IEKK · #6 (**permalink**) 27/08/2011, 02:36

Pero eso te pasa por la tamaño del div. Cuando te pasé el ejemplo era para que lo adaptases.
Obviamente el borde y contenido no pueden tener el mismo height pues se superpondrían.

Es fácil de entender, el height de #borde (tal y como está la CSS) deberá ser siempre 20px más que el height de #contenido.

Si contenido tiene de alto 40px borde tiene que tener 60, si tiene 50px el borde 70 y así...

Código CSS:

Ver original#borde{ 
margin:0 auto;
height:70px;
background:url('http://o2.t26.net/img/register-bg.gif');
padding:10px;
}
#contenido{
height:50px;
background:#FFF;
padding:10px;
}

Espero haberme explicado bien. Saludos.

polarubi · #7 (**permalink**) 27/08/2011, 11:55

Cita:

Iniciado por IEKK

Pero eso te pasa por la tamaño del div. Cuando te pasé el ejemplo era para que lo adaptases.
Obviamente el borde y contenido no pueden tener el mismo height pues se superpondrían.

Es fácil de entender, el height de #borde (tal y como está la CSS) deberá ser siempre 20px más que el height de #contenido.

Si contenido tiene de alto 40px borde tiene que tener 60, si tiene 50px el borde 70 y así...

Código CSS:

Ver original#borde{ 
margin:0 auto;
height:70px;
background:url('http://o2.t26.net/img/register-bg.gif');
padding:10px;
}
#contenido{
height:50px;
background:#FFF;
padding:10px;
}

Espero haberme explicado bien. Saludos.

muchisimas gracias master, ahora me podrias ayudar a ponerlo aca ?

Código:

<script type="text/javascript">
<!--
var ipb_lang_js_blanks   = "{ipb.lang['js_blanks']}";
var ipb_lang_js_no_check = "{ipb.lang['js_no_check']}";
var subsdesc_0 = "{ipb.lang['subsm_no_desc']}";
var subdesc   = new Array(); <!--{SUBS.JSCRIPT}-->
var register_method = "{ipb.vars['converge_login_method']}";
-->
</script>
<script type="text/javascript" src="jscripts/ipb_register.js"></script>
<form action="{ipb.vars['board_url']}/index.{ipb.vars['php_ext']}" method="post" name="REG" onsubmit="return validate_reg_form(event)">
<input type="hidden" name="act" value="Reg" />
<input type="hidden" name="termsread" value="1" />
<input type="hidden" name="agree_to_terms" value="1" />
<input type="hidden" name="CODE" value="02" />
<input type="hidden" name="coppa_user" value="{$data['coppa_user']}" />
<div class="userlinks">
	<div class="maintitle"><{CAT_IMG}>&nbsp;{ipb.lang['registration_form']}</div>
	<div class="formsubtitle">{$data['TEXT']}</div>
	<div class="tablepad">
		<table class='ipbtable' cellspacing="0">
			<tr>
				<td width="50%">
					<fieldset class="row3">
					<legend><b>{ipb.lang['user_name_title']}</b></legend>
<if="ipb.vars['converge_login_method'] == 'username'">
<div class='input-warn-content' id='box-name'><div id='msg-name'>{$errors['username']}</div></div>
						<table class='ipbtable' cellspacing="0">
							<tr>
								<td>{ipb.lang['user_name']} &nbsp;<span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['user_name_text']}">?</a>)</span></td>
							</tr>
							<tr>
								<td>
								  <input type="text" size="50" maxlength="64" value="{ipb.input['UserName']}" id='reg-name' name="UserName" />
								  <img id='img-name' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' />
								</td>
							</tr>
						  </table>
</if>
<if="ipb.vars['auth_allow_dnames'] == 1 OR ipb.vars['converge_login_method'] == 'email'">
<div class='input-warn-content' id='box-dname'><div id='msg-dname'>{$errors['dname']}</div></div>
						  <table class='ipbtable' cellspacing="0">
							<tr>
								<td>{ipb.lang['dname_name']} &nbsp;<span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['dname_text']}">?</a>)</span></td>
							</tr>
							<tr>
								<td>
									<input type="text" size="50" maxlength="64" value="{ipb.input['members_display_name']}" id='reg-members-display-name' name="members_display_name" />
									<img id='img-members-display-name' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' />
								</td>
							</tr>
						 </table>
</if>

						
					</fieldset><br />
					
					<fieldset class="row3">
					<div class='input-warn-content' id='box-password'><div id='msg-password'>{$errors['password']}</div></div>
					<legend><b>{ipb.lang['password_title']}</b></legend>
						<table class='ipbtable' cellspacing="0">
							<tr>
								<td width="1%" nowrap="nowrap">{ipb.lang['password']} &nbsp;<span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['password_text']}">?</a>)</span></td>
								<td width="100%">{ipb.lang['password_confirm']} &nbsp;<span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['password_confirm_text']}">?</a>)</span></td>
							</tr>
							<tr>
								<td><input type="password" size="25" maxlength="32" value="{ipb.input['PassWord']}" id='reg-password' name="PassWord" /></td>
								<td><input type="password" size="25" maxlength="32" value="{ipb.input['PassWord_Check']}"  id='reg-password-check' name="PassWord_Check" /></td>
							    <td width='12'>
							     <img id='img-password' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' />
							    </td>
							</tr>
						</table>
					</fieldset><br />
				
					<fieldset class="row3">
					<div class='input-warn-content' id='box-emailaddress'><div id='msg-emailaddress'>{$errors['email']}</div></div>
					<legend><b>{ipb.lang['email_address_title']}</b></legend>
						<table class='ipbtable' cellspacing="0">
							<tr>
								<td width="1%" nowrap="nowrap">{ipb.lang['email_address']} &nbsp;<span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['email_address_text']}">?</a>)</span></td>
								<td width="100%">{ipb.lang['email_address_confirm']} &nbsp;<span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['email_address_confirm_text']}">?</a>)</span></td>
							</tr>
							<tr>
								<td><input type="text" size="25" maxlength="150" value="{ipb.input['EmailAddress']}"  id='reg-emailaddress' name="EmailAddress" /></td>
								<td><input type="text" size="25" maxlength="150"  value="{ipb.input['EmailAddress_two']}" id='reg-emailaddress-two' name="EmailAddress_two" /></td>
							    <td width='12'>
							      <img id='img-emailaddress' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' />
							    </td>
							</tr>
						</table>
					</fieldset>
					<!--{REQUIRED.FIELDS}-->
					<!--{SUBS.MANAGER}-->
					<!--IBF.MODULES.EXTRA-->
				</td>
				<td width="50%" valign="top">
					<div>
						<b>{ipb.lang['cf_optional']}</b><br /><br />
						<table class='ipbtable' cellspacing="0">
							<tr>
								<td>
									<fieldset>
									<legend>{ipb.lang['op_email_title']}</legend>
										<div class="desc">{ipb.lang['op_email_text']}</div><br />
										<input type="checkbox" name="allow_admin_mail" value="1" class="checkbox" <!--[admin.checked]--> /> {ipb.lang['op_email_ad']}<br />
										<input type="checkbox" name="allow_member_mail" value="1" class="checkbox" <!--[member.checked]--> /> {ipb.lang['op_email_mem']}
									</fieldset><br />
							
									<fieldset>
									<legend>{ipb.lang['op_tz_title']}</legend>
										<div class="desc">{ipb.lang['op_tz_text']}</div><br />
										<!--{TIME_ZONE}--><br /><br />
										<!--<input type="checkbox" name="dst" value="1" class="checkbox" <!--[dst.checked]--> /> {ipb.lang['op_tz_dst']}<br />-->
									</fieldset>
									<!--{OPTIONAL.FIELDS}-->
								</td>
							</tr>
						</table>
					</div>
				</td>
			</tr>
			<tr>
				<td><!--{REG.ANTISPAM}--></td>
				<td valign="middle" align="center">
					<div class="desc">{ipb.lang['submit_text']}</div><br />
						<input type="submit" value="{ipb.lang['submit_form']} &gt; &gt;" />
					</div>

				</td>
			</tr>
		</table>
	</div>
</div>
</form>
<script type="text/javascript">
//<![CDATA[
reg_error_no_name        = "{ipb.lang['reg_error_no_name']}";
reg_error_no_pass        = "{ipb.lang['reg_error_no_pass']}";
reg_error_pass_nm        = "{ipb.lang['reg_error_pass_nm']}";
reg_error_chars          = "{ipb.lang['reg_error_chars']}";
reg_error_taken          = "{ipb.lang['reg_error_taken']}";
reg_error_username_taken = "{ipb.lang['reg_error_username_taken']}";
reg_error_username_none  = "{ipb.lang['reg_error_username_none']}";
reg_error_email_missing  = "{ipb.lang['reg_error_email_missing']}";
reg_error_email_nm       = "{ipb.lang['reg_error_email_nm']}";
reg_error_email_taken    = "{ipb.lang['reg_error_email_taken']}";
reg_error_email_ban      = "{ipb.lang['reg_error_email_ban']}";
var got_dname = 0;
<if="ipb.vars['auth_allow_dnames'] == 1 OR ipb.vars['converge_login_method'] == 'email'">
got_dname = 1;
</if>

init_reg_form(got_dname, register_method);
//]]>
</script>

no logro ponerlo se me deforma todo :S

graciassssssssssssssss