#1294 CSS in Events - Exponent CMS

Type	To find
responsible:me	tickets assigned to you
tagged:"@high"	tickets tagged @high
milestone:next	tickets in the upcoming milestone
state:invalid	tickets with the state invalid
created:"last week"	tickets created last week
sort:number, importance, updated	tickets sorted by #, importance or updated
Combine keywords for powerful searching.
Use advanced searching »

#1294 new

CSS in Events

Reported by Peter | May 26th, 2015 @ 04:26 PM | in User issues

The date field when using the calendar function uses the CSS .dtstart . In a normal browser this is fine. However I have now completed an exercise in making the sandtoft.org site mobile-friendly. In portrait mode for smaller screens I have had to set .dtstart { margin-left: -170px; } so that the date can be displayed - see capture.jpg. This however means that it disappears off to the left when you open an event - see capture1. Is there any way to force a different CSS for the two places where this item is used? (Other two captures are normal browser views).

Thanks.
Peter.

Capture.JPG 66.4 KB
Capture1.JPG 61.7 KB
Capture2.JPG 73.4 KB
Capture3.JPG 33.9 KB

Comments and changes to this ticket

dleffler May 26th, 2015 @ 05:04 PM
- Assigned user cleared.
Although we are setting the class 'dtstart', we never define it as a style so this hasn't been an issue in the past (since the class has no styling assigned)

Regardless, if you want to style it within your theme you could do something like this:
```
.events .upcoming-events-headlines .dtstart { /* headlines view /
  margin 0
}
.events .show .dtstart { / show view */
  margin 0
}
```
You flagged this item as spam.
Peter May 27th, 2015 @ 08:18 AM
- Assigned user set to “expNinja”
Thanks. Unfortunately that has not made any difference. The CSS now includes:

@media (orientation: portrait) and (max-width: 424px) { #doc { width:390px; } #centercol { width: 385px; } #hd { width:390px; height: 56px; background:url(http://sandtoft.slx-online.biz/themes/sandtofttheme/images/header1-...) no-repeat center top #8e0000;border:1px solid #8b0000; } img{ width:auto; max-width: 100%; height:auto; } .vevent li { width: 150px; } .events .upcoming-events-headlines .dtstart { margin: -170px; } .events .show .dtstart { margin; 0px; } /* .dtstart { margin-left: -170px; } */ .event-return:after { content:" -- Best Viewed in Landscape"; } }

Have I missed something?

Thanks.
Peter.
dleffler December 26th, 2015 @ 05:59 AM
- Milestone set to “2.3.7”
[bulk edit]
dleffler January 1st, 2016 @ 04:18 AM
- Milestone changed from “2.3.7” to “2.3.8”
[bulk edit]
dleffler January 1st, 2016 @ 01:45 PM
- Tag set to “css”
- Assigned user cleared.
- Milestone changed from “2.3.8” to “User issues”
dleffler May 2nd, 2016 @ 08:35 PM
- Milestone cleared.
[bulk edit]
dleffler June 3rd, 2016 @ 11:13 AM
- Milestone set to “User issues”

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.