Add a CSS class to field in content type I'm fairly new to Drupal and I want to add a custom CSS class to a custom field in content type.

I've created a content type called 'custom page' and I have a field called 'custom_page_main_title' the only thing I would like to do is to add a custom CSS class or iD to this

How can I do this please? Thanks!
I wrote a blog post about this a little while ago.  It mostly serves as a reference for understanding the method for targeting the markup for specific fields in specific content types utilizing theme functions in template.php which is stored in your theme's directory.

Definitely check it out.  If you can understand it, then in the future changing any of the HTML for particular fields, including the classes generated, becomes trivial.

To bring the pertinent content from my blog post into this thread, we have the following function in template.php:

function theme_field($variables) {
  $output = '';

  // Render the label, if it's not hidden.
  if (!$variables['label_hidden']) {
    $output .= '&lt;div class="field-label"' . $variables['title_attributes'] . '&gt;' . $variables['label'] . ':&amp;nbsp;&lt;/div&gt;';
  }

  // Render the items.
  $output .= '&lt;div class="field-items"' . $variables['content_attributes'] . '&gt;';
  foreach ($variables['items'] as $delta =&gt; $item) {
    $classes = 'field-item ' . ($delta % 2 ? 'odd' : 'even');
    $output .= '&lt;div class="' . $classes . '"' . $variables['item_attributes'][$delta] . '&gt;' . drupal_render($item) . '&lt;/div&gt;';
  }
  $output .= '&lt;/div&gt;';

  // Render the top-level DIV.
  $output = '&lt;div class="' . $variables['classes'] . '"' . $variables['attributes'] . '&gt;' . $output . '&lt;/div&gt;';

  return $output;
}


What you would do would be to replace the word theme in the function name to the name of your theme, and since you're targeting a specific field in a specific content type, you would append to the word field in the function name with __custom_page_main_title__custom_page.  So the function would look something like:

function themename_field__custom_page_main_title__custom_page($variables) {
  $output = '';

  // Render the label, if it's not hidden.
  if (!$variables['label_hidden']) {
    $output .= '&lt;div class="field-label"' . $variables['title_attributes'] . '&gt;' . $variables['label'] . ':&amp;nbsp;&lt;/div&gt;';
  }

  // Render the items.
  $output .= '&lt;div class="field-items"' . $variables['content_attributes'] . '&gt;';
  foreach ($variables['items'] as $delta =&gt; $item) {
    $classes = 'field-item ' . ($delta % 2 ? 'odd' : 'even');
    $output .= '&lt;div class="' . $classes . '"' . $variables['item_attributes'][$delta] . '&gt;' . drupal_render($item) . '&lt;/div&gt;';
  }
  $output .= '&lt;/div&gt;';

  // Render the top-level DIV.
  $output = '&lt;div class="' . $variables['classes'] . '"' . $variables['attributes'] . '&gt;' . $output . '&lt;/div&gt;';

  return $output;
}


Now you need to decide where in the structure of the field the class needs to be added, so perhaps add that on as an addition to your original question.