Hi,
You need to try this in your style.css for getting what you want:
.site-title a {
padding-right: 100px;
word-wrap: break-word;
}
By the way nice site.
Hi Jitendra,
First of all Thanks for the quick response. Appreciate the same.
I tried what you said, but now the text is broken and put onto a new line. Is there a value word-wrap can take which will tell it to truncate the word?
This is how it looks now….
http://pradeepclicks.com/myData/Screenshot_visualTheme_mobile-2.png
I would like to truncate the string
“Pradeepclicks.com [β]”
to
“Pradeepclick…” OR just “Pradeepclicks.c”
Regards,
Pradeep
P.S: I have absolutely no idea about the web development, CSS and such, please bear with me if the questions i raise is very trivial.
Hi Pradeep,
You can try this for changing the font size at lower screens:
@media screen and (max-width: 400px){
.site-title > a {
font-size: 17px;
}}
And also add a background to the mobile menu so that the text which will go behind that will not show:
.menu-toggle {
background: #313131;
}
If you use some lengthy site title in future then you can consider using word wrap also or you can change the font-size if required.
Thanks for helping out in the forums @jitendra.
@androcton, I opened a GitHub issue for this and will attempt to find a solution for long site titles in mobile for the next release: https://github.com/devinsays/visual/issues/12
You are most welcome @devin.