Jump to content


Photo

cforms css in iBlogPro3


This topic has been archived. This means that you cannot reply to this topic.
8 replies to this topic

#1 justme

justme

    Advanced Member

  • Members
  • PipPipPip
  • 80 posts

Posted 28 November 2009 - 12:15 AM

This is sort of a cforms question and sort of a theme question, so I'll risk asking it in case anyone can give me some guidance. I am not a CSS expert but not a novice either.

This is with a style selected in the cforms options, which I like. I realize I can turn off the css but I prefer the look of the cforms option. What is confusing, however, is that all the cforms css files are 'inactive' in the WP editor. I finally discovered that I needed to modify the style.css file (iBlogPro3).

I've managed to get the cformsII Tell a Friend form working in the sidebar. It was originally too wide but I added the form ID in style.css and now the form fits. BUT, now the 'Thank you' message breaks the column width.

My problem is I cannot find where to adjust that. I can only find a .success class in style.css, but don't see where to change the width. I could change the font size but not the background color or width. I suspect a css conflict somewhere - just can't find it.

The page source code is:
 <div id="usermessage4a" class="cf_info success  success4 ">Thank you for your comment!</div>

Any help appreciated. Thanks
David

Posted Image

#2 arpowers

arpowers

    Founder

  • Administrators
  • 3271 posts

Posted 28 November 2009 - 12:19 AM

Hi, Hmmmm. Could you perhaps provide a live link? The easiest way to figure what to change is to use FireBug (for Firefox) and inspect the element. This will tell you why the element is showing up as it is.

#3 justme

justme

    Advanced Member

  • Members
  • PipPipPip
  • 80 posts

Posted 28 November 2009 - 12:25 AM

Hey that was fast. I just edited the post to include the source code on the page. Here's a live link if you want to take a look. http://www.songofsol...1/24/test-post/ thanks

#4 arpowers

arpowers

    Founder

  • Administrators
  • 3271 posts

Posted 28 November 2009 - 01:00 AM

The violating element is `div.cf_info` just set it to: `div.cf_info{width:auto}` also did you disable the cforms default css?

#5 justme

justme

    Advanced Member

  • Members
  • PipPipPip
  • 80 posts

Posted 28 November 2009 - 01:19 AM

Hi Andrew, Thank you, yes the css worked in minimal.css! I had tried making edits to this file before and it didn't seem to do anything. I don't understand why the cforms css files are marked inactive in the WP Editor (I have NOT deactivated the css files in the cforms styling panel. I saw your instructions to deactivate CSS styling altogether when I first started working with the theme and cforms. But honestly it's a little confusing. If I don't deactivate, I can use any of the cforms css and they look like they should. If I deactivate, then the form is rather plain. Should I instead copy the style I want from a cforms stylesheet and add it to iBlogPro3/style.css? Thanks, David

#6 arpowers

arpowers

    Founder

  • Administrators
  • 3271 posts

Posted 30 November 2009 - 01:20 AM

Should I instead copy the style I want from a cforms stylesheet and add it to iBlogPro3/style.css?

That's an effective approach and the one I would take :)

#7 justme

justme

    Advanced Member

  • Members
  • PipPipPip
  • 80 posts

Posted 30 November 2009 - 02:02 AM

Wonderful. Thanks Andrew. Your support is exemplary!

#8 arpowers

arpowers

    Founder

  • Administrators
  • 3271 posts

Posted 30 November 2009 - 02:41 AM

Also, you'll want to keep your 'custom code' separate so you can 're-add' it after an update.

#9 justme

justme

    Advanced Member

  • Members
  • PipPipPip
  • 80 posts

Posted 30 November 2009 - 02:47 AM

Yeah, I'm always kind of paranoid about that. Thanks. :)