CSS Problem

tektonnic

macrumors 6502
Original poster
Mar 6, 2006
336
0
Bucks, UK
Hi All,

The following code describes an input box on a form.

<tr>
<td valign="top" nowrap="nowrap">
 <?php echo htmlspecialchars($params->subjectlabel); ?> </td>
<td>
<input name="subject" type="text" class="inputbox" value="<?php echo
htmlspecialchars($params->subjecttext.' '.$title); ?>" size="70" maxlength="100" /></td>
</tr>


I am trying to add some css within this to add a border, where can I put it?

Cheers, Tek
 

tektonnic

macrumors 6502
Original poster
Mar 6, 2006
336
0
Bucks, UK
<td style="border: 1px solid black">... Thats the one!

so if I do:

<td width=30 style="border: 1px solid black">

then that should make the width of that max of 30?
 

Mitthrawnuruodo

Moderator emeritus
Mar 10, 2004
13,604
146
Bergen, Norway
Take the width into the style, and remember to say if it's in px, em, ex or %.

PHP:
<table style="border: 2px solid #99f; text-align: center;" cellspacing="0">
	<tr style="background: #f99;">
		<td style="border: 1px solid #CCC; width: 80px;">---1---</td>
		<td style="border: 1px solid #999; width: 50px; ">---2---</td>
	</tr>
	<tr style="background: #9f9;">
		<td style="border: 1px solid #666">---3---</td>
		<td style="border: 1px solid #333">---4---</td>
	</tr>
</table>
<br/>
<table style="" cellspacing="0">
	<tr style="">
		<td style="">---1---</td>
		<td style="">---2---</td>
		<td style="">---3---</td>
		<td style="">---4---</td>
	</tr>
	<tr style="background: #9f9;">
		<td style="border-left: 1px solid #333; border-top: 1px solid #333; border-bottom: 1px solid #333;">---5---</td>
		<td style="border-top: 1px solid #333; border-bottom: 1px solid #333;">---6---</td>
		<td style="border-top: 1px solid #333; border-bottom: 1px solid #333;">---7---</td>
		<td style="border-right: 1px solid #333; border-top: 1px solid #333; border-bottom: 1px solid #333;">---8---</td>
	</tr>
</table>
 

tektonnic

macrumors 6502
Original poster
Mar 6, 2006
336
0
Bucks, UK
Hmmm, actually I don't think it looks right now, ta for your help though.

Is there a way of making it so input boxes have a border, I know in safari its default style is to do that but in ie and ff the input boxs arn't very visible, any ideas?
 

Mitthrawnuruodo

Moderator emeritus
Mar 10, 2004
13,604
146
Bergen, Norway
c-Row said:
It should work in all browsers (except for Safari).
Well - especially for the people here at MR - that isn't all browsers... ;)

Also, be careful if you use the size attribute in an input tag, like <input type="text" size="20" ... />, that will not always render to the same width in all browsers... (MSIE, I'm looking at you.)
 

c-Row

macrumors 65816
Jan 10, 2006
1,194
1
Germany
Size settings within the style attribute seem to work fine most of the time, but the standard 'size' attribute is indeed a bit wishy-washy... ;)

You can also change an input field's font using style settings, so they blend better with the rest of your website.
 

mnkeybsness

macrumors 68030
Jun 25, 2001
2,511
0
Moneyapolis, Minnesota
The size attribute is dependent on the browser's default settings and the operating system. Windows fonts are slightly different sizes than Mac fonts and so when it is figuring out the size, it will estimate based on the font that it has available.

A more precise way of defining the size is to define:
Code:
input.yourElement { width: 100px; }