ryan ☆ (miw BRAINROT)'s profile picture

Published by

published
updated

Category: Web, HTML, Tech

some helpful html/css things !

changing the headers for your sections

.friends .heading{ font-size:0; } .friends .heading:before{ content: "friends"; font-size:.8rem; } }

 .friends#comments .heading{ font-size:0; } .friends#comments .heading:before{ content: "comments"; font-size:.8rem; } } .

profile .table-section .heading h4 { font-size:0; } .profile .table-section .heading h4:before{ content: "interests and socials"; font-size:.8rem; } } 

.contact .heading{ font-size:0; } .contact .heading:before{ content: "contact"; font-size:.8rem; } } 

.blurbs .heading{ font-size:0; } .blurbs .heading:before{ content: "about me"; font-size:.8rem; } }


scroll boxes

css (sections like contact or interests box)

.tag { (blurbs, friends, table-section ect)

height: 100px;

overflow: auto;

}

comments

.comments-table {

display: block;

height: 250px;

overflow-y: scroll

}

html (for blogs/profiles, to make certain parts be a scroll box)

<div style="height:200px;overflow-y:scroll;">text text text text text</div>


hide / rename interest boxes
remove a row
.table-section:nth-last-child(2) .details-table tr:nth-child(number){display:none;}
rename rows
.table-section:nth-last-child(2) .details-table tr:nth-child(number) td:first-child p { font-size:0; }
.table-section:nth-last-child(2) .details-table tr:nth-child(number) td:first-child p:before { content:"TITLE"; font-size:.7rem; }

general: (1)
music: (2)
movies: (3)
television: (4)
books: (5)
heroes: (6)

make a background not repeat
background: url(image.url) no-repeat center center
fixed;
background-size: cover;

change "about me" and "who i'd like to meet"
.blurbs .inner .section:first-of-type h4{
font-size:0;
}
.blurbs .inner .section:first-of-type h4:after{
content:"About Me:";
font-size:.8rem;
}
.blurbs .inner .section:last-of-type h4{
font-size:0;
}
.blurbs .inner .section:last-of-type h4:after{
content:"Who I'd Like To Meet:";
font-size:.8rem;
}


let me know if there's more you'd like to know! i can probably help :) sorry i'm literal dogshit at explaining things
Red Yoshi And Mario Look Out


6 Kudos

Comments

Displaying 2 of 2 comments ( View all | Add Comment )

TiredNinjaSquall

TiredNinjaSquall's profile picture

is there a way to separate the code for the interests and socials headers?


Report Comment

cary

cary's profile picture

this is so helpful!! do you know how to add a background image and let it loop?? for some reason it broke for me T_T


Report Comment