Log in

No account? Create an account
11 May 2019 @ 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 @ 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.



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 graffitigraphic or go to Layout Lounge's website.

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.
Jill aka Jo: Chuck: Don't Panic Be Awesomesireesanwar on May 12th, 2019 04:36 am (UTC)
Thanks. I'm glad you like it.
Joanna D.pknumba1 on May 20th, 2019 07:19 pm (UTC)
I started using the new layout, and it all looks great! Right now I'm still trying to tweak it and for some reason my current mood images are not all the way to the left like they should be, or are in your preview layout. Mine are almost to the center of the entry. How do I fix that?
Jill aka Josireesanwar on May 29th, 2019 09:34 pm (UTC)
Sorry didn't see your post... working on the fix right now.
Jill aka Josireesanwar on May 29th, 2019 11:13 pm (UTC)
See if the coding edit I made works:

Joanna D.pknumba1 on May 30th, 2019 08:17 pm (UTC)
I tried the code but I'm still having the same problem.
Jill aka Josireesanwar on May 31st, 2019 12:16 am (UTC)
This is so weird. I didn't have this issue when I was creating it. I'll look into it.
Joanna D.pknumba1 on May 31st, 2019 01:32 am (UTC)
I wonder if different browsers mess with it, but I wouldn't really know. It isn't a huge deal if you can't fix it. I'll get used to it since I probably won't keep this layout for long. Thanks.
Jill aka Josireesanwar on June 3rd, 2019 07:54 pm (UTC)
So I'm wondering if I didn't forget something in the coding. I recreated that area of coding for you...

try this coding again

I updated it. I'm hoping that works.
Joanna D.pknumba1 on June 3rd, 2019 09:00 pm (UTC)
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; }
Jill aka Josireesanwar on June 3rd, 2019 09:25 pm (UTC)
You should really copy the entire code because I made adjustments. I saw the problem on my own journal and then fixed it.

I copied this code from your journal so it should reflect your layout.

Edited at 2019-06-03 09:26 pm (UTC)
Joanna D.pknumba1 on June 3rd, 2019 11:08 pm (UTC)
Okay, that fixed it. Thank you for all your help! Sorry that was such an ordeal.
Jill aka Josireesanwar on June 5th, 2019 11:48 pm (UTC)
It is okay. I don't like the idea of my layouts not working how I wanted them too. ;-)

Seems LJ made some adjustments too. The "text" mood, location, etc is a "current strong" which was making itself known in that empty space. I just had to make it display: none;

It took me so long because that is a new development.
Joanna D.pknumba1 on June 6th, 2019 10:52 pm (UTC)
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.
Jill aka Jo: Castle: Space Cowboysireesanwar on August 30th, 2019 06:24 pm (UTC)
OMG seriously. I look at Java and it is like Mandarin. To me that is the complex thing. LOL LJ doesn't do many updates but sometimes when they do they wreck things. I try to figure those things out to help out my fellow users. So should it happen... check here or ask me. ;-)