Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Plugins & Atahualpa (http://forum.bytesforall.com/forumdisplay.php?f=16)

- - CSS Help? Tools? (http://forum.bytesforall.com/showthread.php?t=18381)

CSS Help? Tools?

Hey all,

Finally got a plugin combo that is working to pull the most recent posts from each category into a slider of sorts. But I am having a terrible time getting the images to center in the viewing area.

How do you guys figure this stuff out? I've tried to use firebug a couple times without much success, is that the best tool to figure out what is wrong in css, etc stuff?

I can do all the CSS edits as far as the margins/padding etc for the images but I can't figure out which name they fall under to do the edits.

Thanks for any help,

Dani

The page with the slider is www.theadventurebite.com/home

Quote:

How do you guys figure this stuff out? I've tried to use firebug a couple times without much success, is that the best tool to figure out what is wrong in css, etc stuff?

Experience, practice. I use firebug a lot but sometimes I'll Go view a page and opy it's source to a file, call it xxxx.html. Then I open xxxx.html I my browser so I can see it. Next I start taking stuff out of the file, save it and refresh it in the browser to see he change.

This can help finding a tricky bit of CSS.

Thanks. That is a good idea.

I have been working with the developer of plugin 1 and basically what he is saying is that the <ul> tag that is being pushed out by plugin 2 needs to be gotten rid of.

I don't think this is possible so I am wondering if it is possible to style it away with CSS.

So far I don't see any css at all in the Mini Loops plugin so I've been trying to do it through CSS inserts in Atahualpa.

Here is what the source code looks like:

Code:

<p><h3 class="wp-tab-title">food.</h3> <div class="wp-tab-content"><div class="wp-tab-content-wrapper"> <ul> <img src='http://theadventurebite.com/wp-content/uploads/7977444197_4207aa287e_z.jpg' width='640' height='480' class='alignleft' alt='' /> </ul> </div></div><!-- end div.wp-tab-content --></p>

So I interpretted that as needing to style the UL within the div class wp-tab-content wrapper.

I tried two different things:

Code:



.miniloops ul img { 

        margin:none !important; 

        padding:none !important; 

        border:none !important; 

}



div#wp-tab-content-wrapper ul{

margin: none !important; 

border: none !important;

padding: none !important;

}

neither of these resulted in any movement at all.

Do these look grammatically correct?

Is what I am trying to do even possible or does a UL always mean there will be space?

Thanks for any tips.

Dani

a UL is the start of an 'unordered list' which means that you can expect one or more LI's inside it. You have none. So you should eithor add some LI's so it is

HTML Code:

<ul.....>

  <li....>

   <img...>

  </li>

</ul>

or get rid of the UL

Yes that is what i thought too. Unfortunately that isn't how her plugin is working nor can I easily just remove them without loosing the whole point of the plugin which is to not have to update the slider with each new post.

I have decided to just style it all in white so that you don't notice the discrepancies until I come up with a better solution.

To center the tabbed images you could use margin: 0 auto on the containing element but you have to set the width of the element. The following comes close. You would put it in CSS Inserts.

HTML Code:

.ui-tabs {

    margin: 0 auto !important;

    width: 690px;

}

I had to add !important to the margin to override what is there.

Hi Larry,

Thanks for the help. It didn't unfortunately work but I have moved to an actual slider now that will accept the code as well. I will open a new string for that since it is a different plugin.

Thank you again.

Dani