How can I get this code's styling to work?

Thank-you for the suggestion!

Unfortunately, when removing that section, absolutely nothing appeared.

And, as mentioned above, I only use the text tab/editor and there are no paragraph tags there so I’m at a loss to understand this…

Are there additional ideas?

OK, I’ve found how to disable that. Per this post, I added the following to my theme’s function.php.

(Please note: The Codex article about this is MISSING the crucial php elements and it would be excellent if that would get added there!)

<?php
remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );
?>

Now the paragraph tags are removed, but now there’s a new unexpected result.

For some reason, it’s trying to apply the styling to the entire page rather than only the 1 place I want it.

How can I get it so it will apply the styling only where I want it?

Flexsqueeze. Please note that it’s a paid theme, but I don’t have access to their primary help forums as I got it when I went to a seminar so they don’t recognize me as a customer.

Is it really theme related, or can the code above be altered in some way?

Note: I’ve found that 95% of the time when someone indicates the theme, it turns out that there was another, much simpler solution that didn’t have to do with the theme. That said, I’m still open to suggestions and ideas…

Thanks!

Thank-you for the suggestion, but I just found my answer!

(And, in answer to your question, I’ve put a lot of custom work in to this so I’d rather not “throw it all away” by switching themes now…)

I had to change

<STYLE type="text/css">

To:
<style scoped>

And then wrapped the entire thing in <div> tags.

The end result is this:

Thank-you very kindly everyone!

<div>
<style scoped>
      UL {
        border-radius: 20px/20px;
        -webkit-border-radius: 20px/20px;
        -moz-border-radius: 20px/20px;
        -ms-border-radius: 20px/20px;
        -o-border-radius: 20px/20px;
        height: 150px;
        width: 527px;
        background: #27d130;
        margin: 12px 12px 12px 12px;
        padding: 5px 5px 5px 5px;
        box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -moz-box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -ms-box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -o-box-shadow: 0 0 20px rgba(0,0,0,0.9);
                                              /* No borders set */
      }
      LI {
        color: black;                /* text color is black */
        font-family: Arial;
        font-size: 14px;
        background: white;           /* Content, padding will be white */
        border-radius: 20px/20px;
        -webkit-border-radius: 20px/20px;
        -moz-border-radius: 20px/20px;
        -ms-border-radius: 20px/20px;
        -o-border-radius: 20px/20px;
        margin: 12px 12px 12px 12px;
        padding: 12px 12px 12px 12px;
        list-style: none             /* no glyphs before a list item */
                                              /* No borders set */
      }
      LI.withborder {
        border-radius: 20px/20px;
        -webkit-border-radius: 20px/20px;
        -moz-border-radius: 20px/20px;
        -ms-border-radius: 20px/20px;
        -o-border-radius: 20px/20px;
        border-style: none;
        border-width: medium;        /* sets border width on all sides */
        border-color: #27d130;
      }
    </STYLE>

    <UL>
      <LI><b><center>Here is some text.</center></b>
      <LI class="withborder">Here is additional text.
    </UL>
</div>

OK, I hope what I believe is the final update will help someone else.

I have now, for the first time, figured out how to link to a .css style sheet I upload to the server.

I, therefore, moved all of the styling code in to its own .css sheet.
I also realized I didn’t need 2 LI.withborder sections so I deleted one of those. The style sheet looks like this now:

.ul UL {
        border-radius: 20px/20px;
        -webkit-border-radius: 20px/20px;
        -moz-border-radius: 20px/20px;
        -ms-border-radius: 20px/20px;
        -o-border-radius: 20px/20px;
        height: 300px;
        width: 200px;
        background: #7220c9;
        margin: 5px 5px 5px -40px;
        padding: 5px 5px 5px 5px;
        box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -moz-box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -ms-box-shadow: 0 0 20px rgba(0,0,0,0.9);
        -o-box-shadow: 0 0 20px rgba(0,0,0,0.9);
                                              /* No borders set */
      }
      LI.withborder {
        color: black;                /* text color is black */
        font-family: Arial;
        font-size: 14px;
        background: white;           /* Content, padding will be white */
        border-radius: 20px/20px;
        -webkit-border-radius: 20px/20px;
        -moz-border-radius: 20px/20px;
        -ms-border-radius: 20px/20px;
        -o-border-radius: 20px/20px;
        margin: 12px 12px 12px 12px;
        padding: 12px 12px 12px 12px;
        list-style: none;             /* no glyphs before a list item */
        border-style: none;
        border-width: medium;        /* sets border width on all sides */
        border-color: #27d130;
      }

Then, on my page, I have the following (which calls that style sheet from the server):

<div>
<link rel='stylesheet' type='text/css' href="http://yourwebsite.com/wp-content/themes/nameofyourtheme/thenameofyourcssfile.css" />
    <ul class="ul">
    <UL>
      <LI class="withborder"><b><center>This is some text.</center></b>
      <LI class="withborder">This is some additional text.
    </UL>
</div>

What I think is the BEST part of this method is that I was able to re-enable the wp-autop by removing that previously mentioned code from the functions.php file with this method!

Now, I’ll just adjust the styling more as turning the wp-autop back on goofed up the look of my box, but adjusting the styling sheet should (hopefully) fix that…

Anyway, like I said, hopefully all this info helps someone out!