css on one page

[djhht]

I am not familiar with how to insert css in Shopsite. I am using custom templates. I read that you can put some CSS in Meta Descriptions if you are using Pro, but I don't know what how to accomplish this.

I have one Content page that I would like to put a list in two columns and it looks like the way to do this is with CSS and the html <ul>. So my question is where do I put the CSS. If I only want to use this on one page, where do I put it?

This is the CSS that might accomplish what I want
ul {
float: left;
width: 12em;
margin: 0;
padding: 0;
list-style: none;
}

li {
float: left;
width: 6em;
margin: 0;
padding: 0;
}

where do I put this??

I am trying to have my list appear in 2 columns.

Thanks!

[ShopSite Lauren]

I would just add the css directly into one of the text fields on the page, such as text 1, 2 or 3. You would need to include the full style tags.

<style type="text/css">
ul {
float: left;
width: 12em;
margin: 0;
padding: 0;
list-style: none;
}
li {
float: left;
width: 6em;
margin: 0;
padding: 0;
}
</style>

[djhht]

I tried that and it takes over the Left Navigation or footer with the style too. Is there anyway to contain the Style to the text only.

[mjbrunelle]

You can either give the tag an id <ul id="idName">, or a class <ul class="className">

#idName ul {
float: left;
width: 12em;
margin: 0;
padding: 0;
list-style: none;
}

Specifc to this tag only

or

ul.className {
float: left;
width: 12em;
margin: 0;
padding: 0;
list-style: none;
}

Specific to any tag using this class

MarkB

[djhht]

Thank you ... that helps, but I am still doing something wrong.
Here is a link to the page I am testing this on:

http://www.homehealthtesting.com/test.htm

it is still messing up the nav on left

<style type="text/css">
ul.column {
float: left;
width: 18em;
margin: 0;
padding: 0;
list-style: none;
}
li {
float: left;
width: 18em;
margin: 0;
padding: 0;
}

</style>

<ul ulclass="column" type="none">


I tried naming the li with a class and it did not work.

Sorry I am such a newbie at this. thanks, Dana

[ShopSite Lauren]

You will want to change the following line:
<ul ulclass="column" type="none">

to:
<ul class="column" type="none">


Then your CSS should be:
<h1>111Test</h1><p><style type="text/css">
ul.column {
float: left;
width: 18em;
margin: 0;
padding: 0;
list-style: none;
}
ul.column li {
float: left;
width: 18em;
margin: 0;
padding: 0;
}
</style>

[djhht]

tried that and it stopped messing with the Left Nav, but lost the column formatting that I was trying to achieve

http://www.homehealthtesting.com/test.htm

[ShopSite Lauren]

All of your information is in the same bullet point list. If you want two columns you would need to have two bullet point lists.

[djhht]

Great!! thank you!
Dana