ext_194372: TVD: Caroline Close Up (Default)
sireesanwar ([identity profile] sireesanwar.livejournal.com) wrote in [community profile] layoutlounge2019-05-11 06:25 pm

103. Florence

Layout Style: S2 Flexible Squares
Features: Header Image, Custom Header Location, Layout Images, Custom Sidebar, No Userpics for posts only comment userpics
Layout Width: Flexible Width

[ PREVIEW ] [ LIVE ] credit @ [livejournal.com profile] layout_lounge
All special fonts have been embedded into the layout from Google Fonts


Coding is a real pain to list here because now anything with a # creates tags in our system. So to get around this I've posting this to the Layout Lounge Site where I keep them anyway. This also gives me a place to store images.

GET THE CODE

IMAGES

Header Image 1500 x 200
a. b.
[ a. 474 x 289 ] [ b. 600 x 346 ]

c. d.
[ c. 1080 x 766 ] [ d. 1080 x 720 ]

Header Image: The header image (.headerimage) attribute is turned off in this layout. You can use the content-outer attribute instead. I did this to control where the header links and image were located.

My header image is only 200px in height. If you want to have a bigger header image there are a few settings you'll have to change in the coding. Here they are in order inside the coding:

  1. content-outer: the height is set to 220px to accomdate some spacing. Should you want a header that is 300px high you'll cange the height to 320px.

  2. content: the same goes for the top margin of content. It is set to accomodate the header and links so this will match the content-outer.

Title & Subtitle: The title and subtitle have been turned off to prevent strange interactions with the layout. Rather than using these I would create and image of your title and put it over the header image you've choosen. See Multiple Header Images but apply it to content-outer.

Userpics: There are no userpics for your posts on this layout. There will be userpics for comments and for the friends page.

Common Issues with Layouts:
1. Common Issues
2. Theme and Layout Change Tutorial
3. Image Tutorial: Adding Background & Header Images in Coding
4. Sidebar: What I Do and Do NOT Want On It
5. LJ Advertisements: What is that weird box on my LJ?
6. Tutorial Index

You can find more images at [livejournal.com profile] graffitigraphic or go to Layout Lounge's website.

RULES
Not hotlinking images please. Imgr images can be used.
Headers can be changed. Please make the layout your own.
Layout images do not have to be used.
Credit is a must.

If you are having trouble with this layout please comment and I'll see if I can help you.

[identity profile] pknumba1.livejournal.com 2019-06-03 09:00 pm (UTC)(link)
This is a real chin scratcher. I tried that one and there were no changes. I'm pretty sure I copied and pasted it right. I even tried getting rid of the little coffee mug next to it, but that didn't do anything at all.

I copied the code that is just from the current mood section. Do any of these numbers seem off?

.currentmood {
background: url(http://i63.tinypic.com/2exo58x.jpg) no-repeat left center;
padding: 2px 0px;
margin: 0px 10px 0px 0px;
}
img.meta-mood-img { margin: 0px 10px 0px 15px; }

[identity profile] pknumba1.livejournal.com 2019-06-03 11:08 pm (UTC)(link)
Okay, that fixed it. Thank you for all your help! Sorry that was such an ordeal.

[identity profile] pknumba1.livejournal.com 2019-06-06 10:52 pm (UTC)(link)
I see. I used to know java pretty well but complex things like layouts kind of confuse me. Especially if a site updates so often.