AI Assistant
Notifications
Clear all

[Closed] How to reduce forum margin on mobile?

5 Posts
2 Users
1 Reactions
1,185 Views
ldj72
Posts: 95
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@ldj72)
Estimable Member
Joined: 4 years ago
[#30404]

Hi,

I am using the QA layout.

The "Vote" button and "margin" are too large on mobile. Look at the screenshot.

How can I reduce it?

Thanks

 

 Capture decran 2023 01 04 173840

4 Replies
Tutrix
Posts: 1519
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@tutrix)
Noble Member
Joined: 6 years ago

@ldj72

try

@media screen and (max-width: 680px) {
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-left {width: 40px; font-size: 10px !important;}
#wpforo #wpforo-wrap .wpfl-3 .wpf-positive {font-size: 18px;}	
#wpforo #wpforo-wrap .wpfl-3 .wpf-negative {font-size: 18px;}
#wpforo #wpforo-wrap .wpfl-3 .wpf-vote-number {font-size: 18px; line-height: 18px;}
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-left .wpf-toggle-not-answer {font-size: 20px; padding-top: 2px;}	
}

 


ldj72
Posts: 95
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@ldj72)
Estimable Member
Joined: 4 years ago

Hi,

Thanks, @Tutrix, it works perfectly.

Regards


1 Reply
Tutrix
(@tutrix)
Joined: 6 years ago

Noble Member
Posts: 1519
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian

@ldj72 

complete the code above with

#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-right {width: calc(100% - 52px);}

should then look like this, so that the content adapts to the mobile size

@media screen and (max-width: 680px) {
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-left {width: 40px;	font-size: 10px !important;}
#wpforo #wpforo-wrap .wpfl-3 .wpf-positive {font-size: 18px;}	
#wpforo #wpforo-wrap .wpfl-3 .wpf-negative {font-size: 18px;}
#wpforo #wpforo-wrap .wpfl-3 .wpf-vote-number {font-size: 18px; line-height: 18px;}
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-left .wpf-toggle-not-answer {font-size: 20px; padding-top: 2px;}	
#wpforo #wpforo-wrap .wpfl-3 .wpforo-post .wpf-right {width: calc(100% - 52px);}	
}

ldj72
Posts: 95
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
(@ldj72)
Estimable Member
Joined: 4 years ago

thanks @tutrix


Share: