Single post in Site Skins: How-To, and Helpful CSS

Forum Index > PokéFarm > Guides > Site Skins: How-To, and Helpful CSS >

👍 1

Posted 11/Sep/2021 15:54:48 (2 years ago)
Edited 11/Sep/2021 15:59:03 (2 years ago)

QUOTE originally posted by GnarleyQuinn

Is there a way to move text away from the outside? This is the post in question. I've tried a few things with no luck. I want a right align for the main/info tab without it feeling so crowded to the right and left edges. I have it centered for now.

You can add padding to the tab contents like this: .tabbed_interface>div { padding: 15px; } Padding separates the contents of an element from its edges/borders. There's a similar property, margins, that separate elements from other elements. You can add padding to the tab headers as well to make them easier to click/look better. Edit to add example:

Tab 1
Tab 2
Tab 3

See tab 2 for larger content where padding is more obvious

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consequat nibh ex, nec interdum eros venenatis ac. Sed euismod, eros auctor tristique molestie, enim neque ultricies arcu, sed convallis tortor sapien in magna. Donec vestibulum posuere suscipit. Praesent aliquet, arcu at aliquam lacinia, urna diam tincidunt dui, vel lacinia libero justo eget tortor. Mauris vel pretium sem. Integer imperdiet et velit sed laoreet. Quisque et magna malesuada, placerat leo vel, suscipit turpis. In placerat ac metus ac tincidunt. Pellentesque luctus odio in lorem pellentesque porttitor. Donec eu hendrerit lacus. Maecenas molestie id odio at gravida. Maecenas ac lorem lobortis, molestie arcu et, tempus augue. Nullam tempus nisl ac dictum mattis. Nullam finibus enim in lectus pulvinar porttitor. Sed non metus quis massa tincidunt commodo at in eros.

Content 3

Loading...

Single post in Site Skins: How-To, and Helpful CSS

QUOTE originally posted by GnarleyQuinn