Calendar cell formatting

[Candace]

I would like the event text on the main calendar to align all the way to the left of each cell-- just like the calendar that appears on this site.  I have tried everything and have given up!  Please help.

[Peciura]

Will you tell us a bit more what you have done? Template and link to your calendar would help also.

[Candace]

I truly appreciate any help you can give.  I have struggled for 12 hours to get this calendar to look right!  I also am not crazy about the dotted lines to separate the events within the same day, but I can't figure out any other way to do it.  I would welcome any ideas you might have.  Thank you very much!

Here is how it looks now:

http://www.quuf.org/index.php?mact=Cale ... 3&page=193

Here is my Calendar css code:[/b]
/*

insert something like this in your page
or template;

{cms_module module="Calendar" table_id="cmscal" first_day_of_week="0"}


*/

#cmscal {
  width: 98%;
  border: 2px solid #696d6e;
  margin: auto;
}
#cmscal .calendar-prev {
  font-size: 1.6em;
}
#cmscal .calendar-month {
  font-weight: bold;
padding: 6px;

}
#cmscal .calendar-next {
  font-size: 1.6em;
}
#cmscal td {
  width: 14%;
  border: 1px solid #696d6e;
  margin: 0;
  padding: 0px;
  background-color: #f3dda;
align: left;
text-align: left;
}
#cmscal .calendar-today{background-color: #af6d61;
font-weight:bold;}

#cmscal th {
  border-bottom: 2px solid #696d6e;
  color: #f3dda;
}
#cmscal tr {
  vertical-align: top;
}
#cmscal ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#cmscal li { 
border-bottom: 2px dotted #696d6e;
margin: 0;
  padding: 0;
  list-style-type: none;
}

#cmscal a, #cmscal a:link, #cmscal a:visited {
  font-size: .9em;
font-weight: bold;
  color: #af6d61;
  text-decoration: none;
}


.calendar-event .calendar-date-title,
    .calendar-event .calendar-summary-title,
    .calendar-event .calendar-details-title




Here is my Event template code:[/b]



{$event.event_title}

{assign var=month_number value=$event.event_date_start|date_format:"%m"}
{assign var=end_month_number value=$event.event_date_end|date_format:"%m"}
{$lang.date}: {$event.event_date_start|date_format:"%B %e, %Y"}

Time: {$event.event_date_start|date_format:"%I:%M %p"} - {$event.event_date_end|date_format:"%I:%M %p"}

{if $event.event_summary !="" && ($detail != 1 || ($event.event_details =="" || 

$event.event_details == "
"))}
{$event.event_summary}
{/if}
{if $detail == 1}
{if $event.event_details !="" && $event.event_details != "
"}
{$lang.details}: {$event.event_details}
{/if}
{else}
{if $event.event_details !="" && $event.event_details != "
"}
{$moretext}
{/if}
{/if}


{* Display custom fields
  There are two ways to address custom fields
  1) {$event.fields.fieldname}
  2) {foreach from=$event.fields key='fieldnamee' item='fieldvalue'}
        {$fieldname}: {$fieldvalue}
      {/foreach}
  You may want to use the former method with file upload fields.
*}

  {foreach from=$event.fields key='fieldname' item='fieldvalue'}
      {$fieldname}: {$fieldvalue}
  {/foreach}

{$return_url}

[Peciura]

Be more spesific when pointing an element you want to style.
Instead of  #cmscal li { ... } write #main #cmscal ul li in your style.

[Candace]

That did the trick!!!  Now how do I get some padding around the date and the event text?  When I made the padding 2 and margin 2, it threw all the text back over to the right.

[Peciura]

Specify margins to element "#main #cmscal ul" ( you  may also  explicitly set style to "#main #cmscal > a"  more at w3.org/TR/CSS21/selector.html)

Or add classes to elements in calendar template.

When I made the padding 2 and margin 2 ....

as you already noticed you want to be more specific ...

Do you use firebug to inspect page style ?
If not - search this forum, or check cmsms documentation, or simply google for it.

[Dr.CSS]

If you look in the bottom of the main layout style sheets you will see some UL and LI styles with #main in front of them if you don't need these for any other UL LI remove them or use them for this pages styling, #main ul and #main li are over riding what your trying to do...