How to add the straight line for each event ?

Resolved chew88
(@chew88)

7 years, 10 months ago

<table cellpadding=”10″ cellspacing=”10″ id=”current-events” >
<thead>
<tr>
<th id=”event-time” width=”150″>Date/Time</th>
<th id=”event-description” width=”*”>Event</th>
/tr>
</thead>
<tbody>

<tr>
<td>
#_{d} #@_{ – d}
<p> #F</p>
#H:#i -#@H:#@i
</td>

<div style=”float:left; margin:0px 10px 0px 0px;”>#_EVENTIMAGE{100,100}</div>
#_EVENTLINK
<i>#_LOCATIONNAME, #_LOCATIONTOWN #_LOCATIONSTATE</i></div>
</tr>

</tbody>
</table>

https://wordpress.org/plugins/events-manager/

………………………………………………
http://demo.wp-events-plugin.com/events/

pls take a look at their website and there is the line for each event.

As I did add the code for the line but it didn’t work out well.

Pls show me ur code so that I can fix the problem

Viewing 8 replies - 1 through 8 (of 8 total)

Thread Starter chew88
(@chew88)

7 years, 10 months ago

Plugin Support angelo_nwl
(@angelo_nwl)

7 years, 10 months ago

demo site uses wordpress theme twentytwelve which adds the line on the events table however you can use custom css styling to add the line.

Thread Starter chew88
(@chew88)

7 years, 10 months ago

I go to appearance than editor than it show only Basix,twenty fifteen, twenty fourteen and twenty sixteen

Can show me the step by step with thanks?

Thread Starter chew88
(@chew88)

7 years, 10 months ago

#current-events td {
border-top: 1px solid #ededed;
padding: 6px 10px 6px 0;
}

Is this correct code for the line?
Plugin Support angelo_nwl
(@angelo_nwl)

7 years, 10 months ago
yes, you can try to add this custom css at the end of your theme style.css or (if your theme supports) admin-dashboard theme options custom css section

eg.
```
table#current-events td {
 border-top: 1px solid #ededed !important;
}
```
Thread Starter chew88
(@chew88)

7 years, 10 months ago

ok. thanks. resovled.

/* CSS Reset
/* ——————————————————————————— */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
html, body {
height: 100%;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: ”;
content: none;
}
:focus {
outline: 0;
}
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
table {
border-collapse: collapse;
border-spacing:left;
}

.test

td{
border-top: 1px solid #ededed;
padding: 10px 6px 6px 0;

{
text-align:left;
}

* {
-webkit-tap-highlight-color: transparent;
}

Is this the correct style.css?

caimin_nwl
(@caimin_nwl)

7 years, 10 months ago

Yes.

Thread Starter chew88
(@chew88)

7 years, 9 months ago

div#em-loading { position:absolute; width:100%; height:100%; background:#FFFFFF url(../images/loading.gif) 50% 50% no-repeat; left:0px; top:0px; opacity:0.8; filter:alpha(opacity=80); z-index:99998; }
.em-search-ajax { position:relative; }
/* Warnings */
.em-warning { margin:10px 0px; padding:10px; color:#333; border-radius:3px; display:block !important; }
.em-warning p { margin:10px 0px !important; padding:0px; color:#333 }
.em-warning-errors { background-color:#FFEBE8; border:1px solid #C00; }
.em-warning-confirms { background-color:#f1fff0; border:1px solid #a8d144; }
a.em-button { float:right; padding:5px 10px; margin:5px; background:#EEE; color:#333; border:1px solid #CCC; border-radius:3px; display:inline-block; text-decoration:none; }
a.em-button:hover { text-decoration:none; }

/* Search Form */
.em-search div { display:inline; }
.em-search label { display:none; }
.em-search .hidden { display:none !important; }
/* Custom Search CSS */
div.css-search { margin-bottom:20px; }
div.em-search.css-search label { display:inline; }
div.em-search.css-search div { display:block; }
div.css-search input, div.css-search select, div.css-search option, div.css-search div, div.css-search span, div.css-search button {
width:auto; height:auto; margin:0; padding:0; float:none; display:auto; font-size:14px; /* reset everything */
}
div.css-search input, div.css-search select { padding:5px; }
div.css-search { background:#FF9900; border:1px solid #dcdcdc; border-radius:3px; padding:5px; min-height:40px; position:relative; -moz-border-radius:3px; -webkit-border-radius:3px; }
/* Main Search */
div.css-search.has-advanced div.em-search-main { padding-bottom:8px; border-bottom:1px solid #dedede; }
div.css-search div.em-search-main div { display:inline; }
div.css-search div.em-search-field { padding:5px 0px; }
div.css-search input.em-search-text, div.css-search input.em-search-geo { width:90%; font-size:16px; line-height:16px; padding:8px; border:none; outline:none !important; color:#666; text-overflow: ellipsis; }
div.css-search div.em-search-geo { margin:0px 0px 0px 5px; padding-left:20px; background:url(../images/search-geo.png) 0px 3px no-repeat; }
div.css-search div.em-search-text { margin:0px 0px 0px 5px; padding-left:20px; background:url(../images/search-mag-ico.png) 0px 4px no-repeat; }
/* Placeholder text in main section */
div.css-search div.em-search-main div.em-search-field input::-webkit-input-placeholder { /* WebKit browsers */ font-size:16px; line-height:16px; padding:3px 0px; border:none; outline:none; color:#666; }
div.css-search div.em-search-main div.em-search-field input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ font-size:16px; line-height:16px; padding:8px; border:none; outline:none; color:#666; }
div.css-search div.em-search-main div.em-search-field input::-moz-placeholder { /* Mozilla Firefox 19+ */ font-size:16px; line-height:16px; padding:8px; border:none; outline:none; color:#666; }
div.css-search div.em-search-main div.em-search-field input:-ms-input-placeholder { /* Internet Explorer 10+ */ font-size:16px; line-height:16px; padding:8px; border:none; outline:none; color:#666; }
/* Geo field specifics */
div.css-search.has-search-geo.has-search-term input.em-search-text, div.css-search.has-search-geo.has-search-term input.em-search-geo { width:40%; }
.pac-container .pac-item { padding:4px 4px !important; }
/* Main Search Button */
div.css-search div.em-search-main .em-search-submit {
position:absolute;
top: 10px; right: 10px;
-moz-box-shadow: 0px 0px 0px 0px #ffffff;
-webkit-box-shadow: 0px 0px 0px 0px #ffffff;
box-shadow: 0px 0px 0px 0px #ffffff;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b7d282), color-stop(1, #8eb56d) );
background:-moz-linear-gradient( center top, #b7d282 5%, #8eb56d 100% );
background-color:#b7d282;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:1px solid #dcdcdc;
display:inline-block;
color:#ffffff;
font-weight:bold;
padding:8px 10px;
text-decoration:none;
text-shadow:1px 1px 0px #c7c5c7;
line-height:16px;
}
div.css-search div.em-search-main .em-search-submit:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff8000), color-stop(1, #A4C48A) );
background:-moz-linear-gradient( center top, #C4DB99 5%, #A4C48A 100% );
background:-ms-linear-gradient(top, #C4DB99, #A4C48A);
background:-o-linear-gradient(top, #C4DB99, #A4C48A);
background:linear-gradient(top, #C4DB99, #A4C48A);
background-color:#A4C48A;
}
div.css-search div.em-search-main .em-search-submit img { border:none; padding:0; margin:0; box-shadow:none; border-radius:0; background:none; }
/* IE7 Hack */ div.css-search div.em-search-main button.em-search-submit span { display:block; width:16px; height:16px; background:url(‘../images/search-mag.png’) 0px 0px no-repeat; }
/* Advanced Search */
div.css-search div.em-search-location, div.em-search-location-meta { margin:0px; padding: 0px; }
div.css-search div.em-search-advanced, div.css-search div.em-search-options { padding:5px 8px; }
div.css-search div.em-search-advanced > div { clear:both; }
div.css-search div.em-search-advanced label { display:block; float:left; min-width:100px; }
div.css-search div.em-search-advanced .em-search-submit { margin:10px 0px; }
div.css-search.no-search-main div.em-search-advanced.visible div { display:inline; clear:none; }
div.css-search.no-search-main div.em-search-advanced.visible label { display:none; }
div.css-search div.em-search-options { text-align:right; }

I want to make the change background color for the search above below the event list. I changed the color in the file instead of the wordpress from wp-content -> plugin> than saved but it didnt show changed the search background color. So how? explain step by step?

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘How to add the straight line for each event ?’ is closed to new replies.