- This topic has 19 replies, 2 voices, and was last updated 4 years, 10 months ago by
.
-
Posts
-
1. How can i change the categorie links in the footer to a smaller letter size?
2. The text above and also under the blog articles; how can i align this text to the left and fill the whole with above and under the articles on desktop and ?
2.1 How can i align this texts on mobile that they not the 100% but 80%, to get some space left and right.I try doing this to add a class to the <p> of the text, and give this by the mobile css 80% and desktop and tablet 90% but it didn’t do anything, the same i try but then with a div around the texts, this did work for the text above the blog articles but i not manage to align both of the texts the same. This are the codes now:
You can find the results on; https://www.testdomein123.be/
Text above the articles, with a hook;
<h1>
Gezondheids website
</h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vitae dui ut risus pretium tristique. Quisque at commodo magna, nec sagittis ex. Nullam rutrum mattis risus ut elementum. Sed commodo non ante sed tincidunt. Curabitur tempus ex ipsum, sed malesuada arcu tempus eget. Duis commodo feugiat elit quis iaculis. Aenean auctor a nibh et rhoncus. Pellentesque nisl erat, ornare non tristique quis, tempor sit amet libero. Sed id orci vel odio hendrerit pellentesque non in erat. In porttitor arcu ut eros luctus convallis. Vivamus volutpat rhoncus justo dignissim pretium. Curabitur interdum tempus lectus eget interdum.<br /><br />
Text under the articles, with a hook:
<h2>
Test H2 tag
</h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vitae dui ut risus pretium tristique. Quisque at commodo magna, nec sagittis ex. Nullam rutrum mattis risus ut elementum. Sed commodo non ante sed tincidunt. Curabitur tempus ex ipsum, sed malesuada arcu tempus eget. Duis commodo feugiat elit quis iaculis. Aenean auctor a nibh et rhoncus. Pellentesque nisl erat, ornare non tristique quis, tempor sit amet libero. Sed id orci vel odio hendrerit pellentesque non in erat. In porttitor arcu ut eros luctus convallis. Vivamus volutpat rhoncus justo dignissim pretium. Curabitur interdum tempus lectus eget interdum.<br /><br />
<h2>
Test H2 tag
</h2>
Lorem Quisque et dolor ligula. Donec auctor massa ut imperdiet faucibus. Mauris finibus dui sed lacus tempor vestibulum. Sed dapibus tortor eget condimentum lacinia. Pellentesque viverra fringilla urna, nec iaculis orci. Sed sit amet auctor neque, ut gravida metus. Donec lobortis eros nec est vestibulum semper. Aenean id ex vitae erat maximus tempus. Morbi laoreet lorem ac magna hendrerit, at tempus nunc fringilla. Vestibulum id egestas dui, id gravida est. In hac habitasse platea dictumst. Nulla facilisi. <br /><br />
<h3>
Test H3 tag
</h3>
Quisque et dolor ligula. Donec auctor massa ut imperdiet faucibus. Mauris finibus dui sed lacus tempor vestibulum. Sed dapibus tortor eget condimentum lacinia. Pellentesque viverra fringilla urna, nec iaculis orci. Sed sit amet auctor neque, ut gravida metus. Donec lobortis eros nec est vestibulum semper. Aenean id ex vitae erat maximus tempus. Morbi laoreet lorem ac magna hendrerit, at tempus nunc fringilla. Vestibulum id egestas dui, id gravida est. In hac habitasse platea dictumst. Nulla facilisi. <br /><br />Customer Support
Hi Vincent,
For question 1, try this CSS:
.footer-widget-2 ul li a { font-size: 17px; }For question 2, are you trying to make the text full width of the screen or as wide as the footer?
Let me know 🙂
I would like to make the texts as width as the block with the blog articles. The text on the top of the homepage could be a littlebit more width, that would be picture perfect.
Thanks again!
For the text on top:
If you remove the style you added:
max-width: 90%; margin: 0 auto;and add this CSS instead should fix the issue:
margin-left: 46px;Like the screenshot below:
https://www.screencast.com/t/FJ6WnOr5rUFor the text at the bottom:
They are currently the same width as the blogs, isn’t this you want?
https://www.screencast.com/t/MlYQhFfAqpJLet me know 🙂
I see what is going wrong; i forget to tell that i would like to have this widths also on the phone and tablet.
So your question is for mobile and tablet view not desktop?
I can’t view your website currently, could you check?
Let me know 🙂
Hi Ying, I managed to move my website by plugin to another domain name, thanks for the tip earlier.
gezondheidsfanaat.nl is the new domainname.
Yes exatcly my question was about mobile and tablet. The desktop version is now perfect with the last tips you give me 🙂
And in the meantime i discovered that there i no menu on the mobile version of the website 🙁
Hi Vincent,
I inspected your site, only at screen width
768pxyour articles are in 2 columns and with sidebar on the right.So let’s try this CSS for tablet:
@media (width: 768px) { .generate-columns-container + div { margin: 0 48.5px !important; } }And this for mobile:
@media (max-width: 767px) { .generate-columns-container + div { max-width: 264px; } }You are using off canvas panel for mobile menu, so you’ll need to assign a menu to the off canvas menu:
https://www.screencast.com/t/WzEaidvHUHi Ying, for the tablet version iam happy, but for the mobile version; there happens nothing. Like it is on the tablet with the space in between of the text and the border of the screen, left and right from the text, thats how i would like it.
I did put my login data in the field, then you can look to it 🙂
I’m not able to log in, wrong pw or username.
The text you added has an inline style that might have overridden the CSS I wrote.
https://www.screencast.com/t/912SoJ8KHLCould you remove that inline style? You can use additional CSS to add it back if you want.
Hi Ying, I did remove the inline style for the text on the bottom of the page and also for the text on the top of the page.
For the text on the top of the page on the desktop version; the text goes to the left. Also for the tablet the text goes to the left, even more than on the desktop version. And for the mobile version also the text goes to the left on the top of the page.
For the text on the bottom of the page; desktop version is the text still okey, for mobile it goes to the left and for tablet is the text also okey 🙂
And i did add the mobile menu, thanks! 🙂
I did put a new password in the field, and i test it 🙂
This time I can log in 🙂 Try this CSS:
For desktop:@media (min-width: 769px) { .home .generate-columns-container > div { padding-left: 46px; } }For tablet:
@media (width: 768px) { .generate-columns-container + div, .home .generate-columns-container > div { padding-left: 92px; padding-right: 46px; } }For mobile:
@media (max-width: 767px) { .generate-columns-container + div, .home .generate-columns-container > div { max-width: 264px; margin-left: auto; margin-right: auto; } }Hi Ying, all your CSS codes work, but there happens something strange; If i put the desktop CSS in the code it will work, then i go over to the tablet field and put the tablet code in it. Than change the desktop code to the tablet code. And the same problem for mobile.
I also tried to publish in between of every time that i put a code in it. This also doens’t work.
Al the codes for them self work good, but if i change a field then the other fields change with the last adjustment.
How did you add the CSS?
I tested the codes in your customizer > additional CSS and they worked.
Let me know.
I add it with additional CSS in the customizer, but is this code only for the text on the bottom or also for the text on the top? Because on the top of the page the text is to width on my desktop. For sure i also removed the cookies and use the private browser function.
A link to my screenshot;
screenshot to width textAn other for you i guess simple question; how can make the menublock 100% width?
- You must be logged in to reply to this topic.
