PDA

View Full Version : My image borders are not showiing ??



jeddi
06-19-2012, 01:21 PM
I have a page with images on and because the images tend to merge into the page I wanted to put borders around them.

This is the inline css


<img style="border:2px; border-color:blue;" src='http://www.expressresponse.net/images/tute_wp_04.jpg' alt='Auto Responder for SimplePage' title='Auto Responder for SimplePage'>

Not sure why it's not working :confused:

This is the page:

http://www.expressresponse.net/HowToAddAutoResponderToSimplePage.php


Any ideas ?

Thanks.


.

abduraooft
06-19-2012, 01:27 PM
You need to add a border-style:solid/dotted/dashed; Or just

border:2px solid blue;

jeddi
06-19-2012, 03:26 PM
Thanks,

I thought that I could also use this method
for the border:


<INPUT name="x_name" value='' size="20" border="1"
maxlength="30" type="text">

But it doesn't seem to work.

As you can see on this page:
http://gigext.com/

the input boxes and the SUBMIT button do not have borders.

The code looks like this:


<!-- Express Response Plugin-Code Begin -->
<div style="width:200px; border:1px solid black; padding:20px;">
<span style="font-size:14px;font-weight:bold;color:black;">
Pick Up Our Free Newsletter</span>
<form name="regis"action="http://expressresponse.net/leads.php"
method="POST"><span><input type="hidden" name="xrkey"
value="uk96k1978a9172j96xy"></span><br>
<span><b>Name:</b>
</span><span><INPUT name="x_name" value='' size="20" border="1"
maxlength="30" type="text"></span><br><span>
<b>Email: </b></span><span><INPUT name="x_email"
value='' size='20' maxlength='60' type='text'></span>
<br><br><center><input type='submit' value='SUBSCRIBE'>
</center><span style="font-size:8px;"><br>
<a href="http://www.expressresponse.net">
Free Autoresponder Plugin</a></span></form><br>
</div>
<!-- Express Response Plugin-Code End -->



Do I have to put style="border:1px solid black;" on
each of the 3 lines ? or is there a more efficient method ?

Thanks.


.

EpicWebDesign
06-19-2012, 04:43 PM
Use CSS to set your styles so you don't have to type it out every time. Also, try to keep your code case-sensitive when referring to the various page elements (especially if you need to use them in a javascript) It's just good practice.

Here's an example to show you how you can assign all the styles once and they will populate throughout your page:

CSS:

#main {
width: 200px;
border:1px solid black;
padding:20px;
}

#sp1 {
font-size:14px;
font-weight:bold;
color: #000;
}

#sp2 {
font-size:8px;
}

img {
border:2px solid blue;
}

input {
border:1px solid black;
}

and then your HTML:

<div id="main">
<span id="sp1">Pick Up Our Free Newsletter</span>
<form name="regis"action="http://expressresponse.net/leads.php" method="POST">
<span><input type="hidden" name="xrkey" value="uk96k1978a9172j96xy"></span><br />
<span id="sp1">Name:</span>
<span><input name="x_name" value='' size="20" maxlength="30" type="text"></span><br />
<span id="sp1">Email: </span>
<span><input name="x_email" value='' size='20' maxlength='60' type='text'></span>
<br /><br /><center><input type='submit' value='SUBSCRIBE'></center>
<span id="sp2"><br /><a href="http://www.expressresponse.net">Free Autoresponder Plugin</a></span>
</form><br />
</div>

jeddi
06-20-2012, 06:17 AM
Thanks for reply.

But this being a "Plugin Code" it has to be self supporting.
Between:

<!-- Express Response Plugin-Code Begin -->

and

<!-- Express Response Plugin-Code End -->

The reason is, this code will be copy n pasted into webapges where
I have no control over the css.

So I need to use inline css.

I want to keep the code as short as possible.

Do I have to put style="border:1px solid black;" on
each of the 3 lines ? or is there a more efficient method ?


Thanks.


.

Will Bontrager
06-20-2012, 01:41 PM
If you have no control over the CSS where your code will be used, I think your only viable option is to use inline CSS. Independently importing CSS code could result in class name clashes.

Will