Answers.Body: <p>There is a file <code>css/civicrm.css</code> within your CiviCRM codebase, and that's what determines the layout here, but you should not edit that.</p>
  
  <p>Instead, you have two good options for writing CSS that overrides the default CiviCRM CSS:</p>
  
  <ul>
  <li><strong>Edit your site's theme.</strong>  Theme CSS will take effect within CiviCRM forms.</li>
  <li><strong>Create a custom CSS file.</strong>  Put your file somewhere that won't get overwritten upon upgrade, and set the path to it in the "Custom css URL" field at Administer - System Settings - Resource URLs.</li>
  </ul>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-11-19T01:02:49.500Z
Answers.Text: Ok that was very helpful. I placed the following in my theme's main css file
Answers.UserDisplayName: Caroline B
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-11-19T01:03:04.267Z
Answers.Text: .crm-container .crm-section .label {
      float: left;
      width: 100%;
      text-align: left;
  }
  
  .crm-container.crm-public .content {
      padding-top: 6px;
      margin: 0px;
  }
Answers.UserDisplayName: Caroline B
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-11-19T01:04:08.247Z
Answers.Text: This put my questions above my answers and aligned both answers and question to the left. I am not a CSS person so others feel free to point out what's wrong but hopefully it will give someone else a chance at altering this too! Thanks
Answers.UserDisplayName: Caroline B
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-11-18T14:26:23.133Z
Answers.LastActivityDate: 2015-11-18T14:26:23.133Z
Answers.UserDisplayName: Andie Hunt
Body: <p>I am trying to alter the layout/theme setings of the petition. I am using a petition with a profile. The petition questions are put in a very narrow left hand column and the answers in a wide column on the right. I can't work out where I would put or alter the CSS to make the questions just sit above the questions. I have attached an image. Any help on tracking down the correct file woudl be appreciated!
  <a href="https://i.sstatic.net/YPgW1.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/YPgW1.jpg" alt="petition image"></a></p>
  
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2015-11-18T13:02:07.470Z
Comments.Text: If possible, Please provide the link of the question - that would be more easy to give you answer -
Comments.UserDisplayName: Ramesh - ARTECH Consultancy
Tags: <civicampaign><css>
Title: civicrm theming
ThreadText: # civicrm theming
  
  (Asked by: username_0 on 2015-11-18)
  
  I am trying to alter the layout/theme setings of the petition. I am using a petition with a profile. The petition questions are put in a very narrow left hand column and the answers in a wide column on the right. I can't work out where I would put or alter the CSS to make the questions just sit above the questions. I have attached an image. Any help on tracking down the correct file woudl be appreciated!
  [![petition image](https://i.sstatic.net/YPgW1.jpg)](https://i.sstatic.net/YPgW1.jpg)
  
  **Tags:** civicampaign, css
  
  > **Comments:**
  > **username_1**: If possible, Please provide the link of the question - that would be more easy to give you answer -  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_2 on 2015-11-18. Score: 4
  
  There is a file `css/civicrm.css` within your CiviCRM codebase, and that's what determines the layout here, but you should not edit that.
  
  Instead, you have two good options for writing CSS that overrides the default CiviCRM CSS:
  
  * **Edit your site's theme.** Theme CSS will take effect within CiviCRM forms.
  * **Create a custom CSS file.** Put your file somewhere that won't get overwritten upon upgrade, and set the path to it in the "Custom css URL" field at Administer - System Settings - Resource URLs.
  
  > **Comments:**
  > **username_0**: Ok that was very helpful. I placed the following in my theme's main css file  
  > **username_0**: .crm-container .crm-section .label {     float: left;     width: 100%;     text-align: left; }  .crm-container.crm-public .content {     padding-top: 6px;     margin: 0px; }  
  > **username_0**: This put my questions above my answers and aligned both answers and question to the left. I am not a CSS person so others feel free to point out what's wrong but hopefully it will give someone else a chance at altering this too! Thanks  
  
  ---
  
  