Baskerville 2: mobile device header & sidebar display

nilla2014 · Member · Jan 18, 2019 at 7:06 pm
Copy link

Add topic to favorites
Hi,

Just testing my site on all devices and the following displays incorrectly on a mobile device:

1. Header image is truncated
2. Sidebar displays to narrow and nothing is legible

Many thanks

The blog I need help with is: (visible only to logged in users)
g471n · Member · Jan 21, 2019 at 11:57 am
Copy link
Hi nilla2014

It looks like you have made some changes since this post. I’m not seeing a sidebar on the site. Do you still need help with this?
nilla2014 · Member · Jan 21, 2019 at 12:30 pm
Copy link
Hi g471n,

I’ve made changes for a desktop but no mobile/tablet devices:
1. Still display my header truncated.
2. Sidebar displays at the end of the post now, so I need to make the content area wider.
3. Comments display as a slither of only a few characters.

Thanks for your help! :)
g471n · Member · Jan 21, 2019 at 4:12 pm
Copy link
OK, I see the problem now when you click through to the blog post.
g471n · Member · Jan 21, 2019 at 4:33 pm
Copy link
You have a line of custom CSS that seems to be causing these two issues.

2. Sidebar displays at the end of the post now, so I need to make the content area wider.
3. Comments display as a slither of only a few characters.

Try removing the following line from your custom CSS.
```
body.single .content {
    width: 75%;
    margin-left: .5%;
}
```
While you try that, I’ll have a look at your Header image :)
nilla2014 · Member · Jan 22, 2019 at 2:12 pm
Copy link
Hi g471n,

I’ve removed the CSS but also:
/*Adjust sidebar width*/
.sidebar.fright {
width: 22%;
}

Results:
Mobile device: fixed display
Desktop: fixed Header display; default content width is narrow and sidebar width is wide, so a lot of wasted space – reason I change these widths.
Tablet: Header still truncated; sidebar width defaults to content width so makes sidebar images larger than on a desktop – weird

Many thanks for you help!

for mobile devices but the content is quite narrow and the sidebar wide with wasted space for desktop, and the reason I changed the container widths.

No items found.