Search page .entry-content CSS

usinarevista · Member · Apr 30, 2014 at 3:46 am
Copy link

Add topic to favorites
Hi! I’m facing a problem with the search results display. For some reason it doesn’t follow the .entry-content rules that are visible in the rest of my website. The font-size, line-height, padding, for instance, are all different. On my CSS there are entry-contents such as li, dd, dt, pre, div, kbd and so on. I believe I must add a “letter” that corresponds to the search page, but I’ve no idea how to find that out.

I appreciate any help! Thanks

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Apr 30, 2014 at 4:10 am
Copy link
Hi there, the search page on Sight will require you to add some additional selectors to the items that are currently not styled the same as your other pages. As an example, for the entry titles, you will need to add a second selector to the .home .entry-title rule you have so that it looks like this:
```
.home .entry-title, .search .entry-title {
    padding-left: 0;
    padding-top: 0;
    text-align: left;
}
```
usinarevista · Member · Apr 30, 2014 at 5:17 am
Copy link
Hey! Some of it worked, but the font-size, for example, still looks weird although it is (and already was) like this: `.home .entry-content p, .archive .entry-content p .search .entry-content p {
font-size: 1.4rem;
line-height: 1.5;
padding-right: 0;
}
```
or
```
.search .entry-content {
text-align: justify;
}`

I think the font by default is not the same. It looks instead like the featured-slider. Is it possible to change it becomes a little more similar to the home/archive pages?

Thanks
usinarevista · Member · Apr 30, 2014 at 5:17 am
Copy link
oops. wrong code usage hehe
thesacredpath · Member · Apr 30, 2014 at 3:34 pm
Copy link
On the content, on the main page of your site, the body copy in the posts is under .entry-content p, but on the search page, it is under .entry-summary p, so to have the same styling, you will need to change this (also note there is a missing comma after .archive .entry-content p):
```
.home .entry-content p, .archive .entry-content p .search .entry-content p {
    font-size: 1.4rem;
    line-height: 1.5;
    padding-right: 0;
}
```
to this.
```
.home .entry-content p, .archive .entry-content p, .search .entry-summary p {
    font-size: 1.4rem;
    line-height: 1.5;
    padding-right: 0;
}
```
There is also a slight difference in the color. On the main page, this is the content body text color:

.entry-content p, .entry-content li, .entry-content dd, .entry-content dt, .entry-content pre, .entry-content address, .entry-content div, .entry-content kbd, .entry-content tt, .entry-content var {
color: #262626;
}

On the search page, the content body text is pulled from here:
```
body, button, input, select, textarea {
    color: #000000;
}
```
The font family is the same on both, inherited all the way back up to the following:
```
body, button, input, select, textarea {
    font-family: 'Helvetica Neue',Arial,sans-serif;
}
```
usinarevista · Member · Apr 30, 2014 at 8:47 pm
Copy link
Perfect! That worked out flawlessly :)
usinarevista · Member · Apr 30, 2014 at 8:58 pm
Copy link
One more question. I’ve just found out that the “justify” I tried to apply specifically to the search area, also changed my home sidebar “most accessed” list. This was the code used: `body, button, input, select, textarea {
color: #262626;
text-align: justify;
}`

How can I restrict it to only the search results? In the areas I desire, I’ve been using other ‘justifies’. But in this case I don’t think it looks nice…

Thanks!
hafizr · Member · Apr 30, 2014 at 11:58 pm
Copy link
If you’re only targetting the search result area, you can use this instead:
```
.search .entry-summary p {
    text-align: justify;
}
```
usinarevista · Member · May 1, 2014 at 11:06 am
Copy link
thanks!

No items found.