Adjust css styles for "Image" field type in a form

stryker129
Mega Guru

As per http://wiki.servicenow.com/index.php?title=Using_Image_Fields#gsc.tab=0 I need to change .css file related to current form.

I need to change width/height if Image field in order to decrease Image size in the table and in the form (while uploading new image).

Where can I find/change proper css ?

I've tried to do that through the table itself:

Gyazo - d8ddcfcc50a8bb3dabf238f00cc9702d.png

Gyazo - 1fba089892c1d86c096c4b43a1dbc923.png

Gyazo - 176c7351fbb9ca4768615a077dd2d53f.png

but nothing helped.

Am I in a right way?

8 REPLIES 8

shloke04
Kilo Patron

Hi,



You can right click on the Field and then Select the Option as "Configure Style" and Update the CSS i.e. Height and width in the Style field as shown below:



find_real_file.png



Select your field Name and Update the Style field:



find_real_file.png



Hope this helps.Mark the answer as correct/helpful based on impact.



Regards,


Shloke


Hope this helps. Please mark the answer as correct/helpful based on impact.

Regards,
Shloke

sounds good.


Last question here: in your screen shot - what does "Value" text input stand for?


Thanks


Unfortunatelly it does not work for me:


1. I opened "customer_notes" table


2. Open form and right click on "Logo" field - select "Configure styles" Gyazo - d24c0775e3fd4e66c346ffba0f20eefb.png


3. Added new Style: Gyazo - e8d1701cacf2973569e03bb663699037.png


4. Added new style max-width:50px; Gyazo - 4aa8d908ff414c4e778cfece41ead5d4.png then clicked Update


5. Back to "customer_notes" table - Logo is still large, not 50 px width: Gyazo - d6ecd203171ad4dcb1c1dd2940e2730b.png


6. Tried to add new record: open new form; add new image to "Logo" field:
Gyazo - ccf040384c7ecc2104484c5fcfb4f19b.png


Gyazo - 4f2dc6b56f427e62532de360e0cb983f.png


Gyazo - d45381b0d7bacad0fe8f7477601902a1.png


Logo is still large in a form



Firebug on the "user_image" element says that there are no new styles attached.


Gyazo - 93c26eddc8465e8dae94e2aef975c898.png



How to fix that?


I want to know the answer to this question also.