Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

Wordpress Themes - WP Forum at BFA » Forum Usage » Forum How-To »

Styling the Comment Fields...


  #1  
Old Aug 17, 2010, 05:57 AM
eric41's Avatar
eric41
 
51 posts · Aug 2010
Nieder Sachsen, Germany
Hi. I want to mention first that I have, over the past months, gotten invaluable help from this forum and would be pretty far behind where I am now without the benefit of especially Flynn, lmilesw and juggledad..so many thanks, and when I get paid this week, I plan to go ahead and make the overdue donation so I can finally enjoy the coveted Gold Forum!

Now for my question:

I am using 3.4.6, and I am working on a site for which I have created a condensed layout, so I'm having to do some touch-up styling on the various comments features. I now have everything styled & configured correctly to match the new layout EXCEPT the comment elements for users as opposed to admin comments.

The following CSS insert...

ul.commentlist li {
margin: 0px 210px 0px 108px; padding: 0;
}


...shrank the admin comments perfectly, but the user comments still stretch the width of the page. What do I need to make the user comments match everything else here?

You can see what I mean here - just scroll to the comments at bottom.

Thanks again for all the great help and support here!

Last edited by eric41; Aug 17, 2010 at 06:03 AM.
  #2  
Old Aug 17, 2010, 07:52 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
I'm not sure what you are trying to do but your site is not looking good in Firefox. The selector you are looking for however is probably.
HTML Code:
ul.commentlist li.thread-even
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #3  
Old Aug 17, 2010, 08:09 AM
eric41's Avatar
eric41
 
51 posts · Aug 2010
Nieder Sachsen, Germany
I'm aware of the cross-browser issues & I'll look into those soon..that's kind of new territory for me. But for the moment, I have added the following code via CSS Inserts, using the selector you provided...

ul.commentlist li.thread-even {
margin: 0px 210px 0px 108px; padding: 0;
}


..which has the same margin values as the ones with the other selector I used. As I mentioned, the first piece of code fixed the admin reply box but not the user reply box. Unfortunately, adding the bit of code above did not change anything. Do I have it correctly above?
  #4  
Old Aug 17, 2010, 08:27 AM
eric41's Avatar
eric41
 
51 posts · Aug 2010
Nieder Sachsen, Germany
Hmm..strangest thing; removing the 1 pixel border between single comments at Style & Configure Comments>Border between single comments fixed the problem! It also appears just fine in Firefox. That's a relief.

However, the text above the first post comment that says, "2 Comments to...", where can I style/edit that? I just want to move it over to line up with the rest. You can use my link to the page above if necessary. Thank you for the reply, lmilesw!
  #5  
Old Aug 17, 2010, 08:44 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
It still doesn't look right in Firefox. Why don't you just set the width to 800px instead of 1280px? Then you won't have to deal with all the crazy padding.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #6  
Old Aug 17, 2010, 09:30 AM
eric41's Avatar
eric41
 
51 posts · Aug 2010
Nieder Sachsen, Germany
Well, my header is an image map placed in the page body, so every time I tweaked the page body dimensions, the header got out of whack, and I couldn't get it all to line up. I will go with your advice for sure though from here on out.

Are you able to point me in the right direction on spacing the "2 comments to..." over some to line up with the comments boxes? Thank you!
  #7  
Old Aug 17, 2010, 09:48 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
As a test I put all the following code where you would normally put %image in ATO>Style & edit Header Area and it seemed to work fine.

HTML Code:
<img id="Image-Maps_2201008121050162" style="border: 0px; padding: 0px;" usemap="#Image-Maps_2201008121050162" src="http://www.fitfabulousforever.com/wp-content/uploads/2010/02/Header.jpg" border="0" alt="" hspace="31" vspace="-1" width="884" height="210" /></div>
<map id="_Image-Maps_2201008121050162" name="Image-Maps_2201008121050162">
<area shape="rect" coords="676,0,819,21" href="http://www.fitfabulousforever.com/live-chat" />
<area shape="rect" coords="17,141,69,162" href="http://www.fitfabulousforever.com" />
<area shape="rect" coords="74,141,130,162" href="http://www.fitfabulousforever.com/about" />
<area shape="rect" coords="134,141,200,162" href="http://www.fitfabulousforever.com/my-blog" />
<area shape="rect" coords="205,141,258,162" href="http://www.fitfabulousforever.com/shop" />
<area shape="rect" coords="262,141,352,162" href="http://www.fitfabulousforever.com/testimonials-2" />
<area shape="rect" coords="357,141,424,162" href="http://www.fitfabulousforever.com/recipes" />
<area shape="rect" coords="430,141,494,162" href="http://www.fitfabulousforever.com/contact-2" />

<area shape="rect" coords="792,167,812,186" href="http://www.facebook.com/pages/Fit-Fabulous-Forever/10150131176825484?ref=ts" />
<area shape="rect" coords="817,167,837,186" href="http://www.fitfabulousforever.com/rss" />
<area shape="rect" coords="843,167,863,186" href="http://www.twitter.com/galecompton" /></map>
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.

Last edited by lmilesw; Aug 17, 2010 at 10:02 AM.
  #8  
Old Aug 17, 2010, 09:57 AM
eric41's Avatar
eric41
 
51 posts · Aug 2010
Nieder Sachsen, Germany
Uh, which following code miles?
  #9  
Old Aug 17, 2010, 10:02 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
Sorry about that. It is there now.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #10  
Old Aug 17, 2010, 11:51 AM
eric41's Avatar
eric41
 
51 posts · Aug 2010
Nieder Sachsen, Germany
Miles, thanks very much for that, but I'm a little confused. Were you offering that as a way to plant the header in an area that wouldn't be affected when I adjust the page body dimensions? Previously, I was putting it at CSS Inserts, but the problem there was that I couldn't figure out how to apply it only to certain pages which is important for the site. When putting it at ATO>Header Area, is there a way to apply it only to certain pages and put an additional image map header there that would apply to other pages?

Also, did you come up with anything on how to space over the comments header ("2 comments on...") line so that it lines up with my page body background?

Thanks again for taking the time!

Last edited by eric41; Aug 17, 2010 at 11:55 AM.
  #11  
Old Aug 18, 2010, 07:47 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
I didn't realize you only wanted it on certain pages. In that case you can use a selector similar to the following. To get the page id just view the source and search for "body class" you will see the "page-id-xx".
HTML Code:
body.page-id-40
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
preset bfa custom fields (bfa_ata_option meta fields) Douglas Center area post/pages 2 Jan 3, 2011 04:36 PM
Add Custom Comment Fields to Posts rebmarmad Post-Kicker, -Byline & -Footer 1 Dec 21, 2009 04:36 PM
[SOLVED] 3.3.3: Comment form fields are not translated any longer upscho Languages & Translations 2 Jun 22, 2009 05:25 AM
Styling all the elements of the comment box via CSS inserts perdox808 Comments, trackbacks & pings 7 Jun 14, 2009 02:59 PM


All times are GMT -6. The time now is 12:46 AM.


Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.