ext_194372: TVD: Caroline Close Up (Default)
[identity profile] sireesanwar.livejournal.com posting in [community profile] layoutlounge
Account Status: All
Theme: Flexible Squares, maybe others
Actions: Free Text/Blurb styling.
Links: Code Index

I've done a tutorial where you learned a little bit about tables in a post (Mixed Content Side by Side or Tables). But, now, let's talk about coding for your free text or blurb on your sidebar. See it is very different and works a little like your profile. Here is the dilemma we are presented with this image on the right. What I don't want my sidebar to do:

  1. There is a gap at the top of my sidebar

  2. Looks like there more than one line of a gap between my text and my textbox.

  3. All my book images are on a different line

  4. There is a HUGE gap between my book images and my table.

How do we fix this? First, when you see extra spacing on the sidebar, always check the blurb text coding first because sometimes it is just the coding in that section.



First if you notice the center is on a different line than my text as is the /center. In the free text this will mean extra space. Also, you need to look at the textbox (or text area) like this: the and blank line between my textbox and my text is 2 lines which is why the gap there looks greater than I want. If I change the coding to what you see below it will change the look of my free text.

No matter what you do the center and /center will act as a line so this mean for only one line between text and textbox I must remove any extra lines between them in my code.
What about those books or images? The reason they are not on the same line is because I have each image and it's link on a seperate line in my coding. But I want a gap between the textbox and those images. This is how we should code it:

But does this apply to the table? Let's look at this part of the coding....

There appears to be only one line between the images and the table. But what have we learned so far. Any extra line breaks can result in extra space. But how can that be because our table looks normal?

Because of the table coding it is shoving all the extra line breaks above the table. So when coding a table it needs to look more like this:

Your sidebar now will look like this:
What a change right?

This mentality of coding is pretty much the same when dealing with your profile coding. So the same principles apply.

Any questions about this tutorial? Please Comment
This account has disabled anonymous posting.
If you don't have an account you can create one now.
HTML doesn't work in the subject.
More info about formatting

About

Welcome to the Lounge. Our tutorials are saved here. These are currently all for LJ and Flexible Squares. Should you have general questions about us check out our FAQ. I do NOT customize layouts for individuals.


    Layout Change Quick Guide
If you like Flexible Squares, I have tons of layouts for you, and still create them.

I've been creating Layouts for DW's Bannering. Here's how to use them:
1. Go to Transmogrified Layouts.
2. Choose Basic.
3. Go to Custom CSS.
4. Make sure all boxes are unchecked
5. Copy Coding to Stylesheet Box.
6. Make sure to update with your own images/image urls. Imgur images are okay to be used.
7.Click Save.


Tips Welcome:

You can also find layout_lounge at LiveJournal.

Tags

April 2025

S M T W T F S
  1 2345
6789101112
1314 1516171819
2021 2223242526
2728 2930