Build Your Own Business Website header image

Float Property

How to Customize the Post Box in Thesis 2.1 – Part 2 – Align the Image and Text with the Float Property

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to -

Once you understand the structure of the post box in Thesis 2 the very first thing you have to wrestle with is this concept of float. Let’s look at this thumbnail image here. When we select the alignment you see it is assigning a class called "align:left" to this which makes the image float to

How to Create a Custom Opt-in Form with MailChimp & Thesis 2 – Part 4 – Style the Email Field

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects - ,

Applies to -

The other thing we need to do is style this the same way this is, right? This is the type=text, this is type=email and we could change that to type=text or we could add the type=email to our style. We have a typical form input here someplace, typical post box, typical text input, this is

How to Create a Feature Box with Graphics, Text and an Aweber Form in Thesis 2 – Part 4 – Arrange the Form Fields

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

We’re going to continue to refine the AWeber Opt-in form inside our feature box in this Thesis 2 template. We want to float this thing left. That was af-element. And let’s just copy that. Then we’ll just come back over to the CSS and down in our opt in background, we’re going to go to

Troubleshoot Background Image Problems in Thesis 2

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

In this session we troubleshoot background image problems in Thesis 2 caused by a code that prevents the floats from being cleared so the container is not extending all the way to the bottom of the page. We also talk about turning off Super Cache when making changes to the background of the container because

What’s the Purpose of a Clearing Div?

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

In this session we discuss the purpose of a clearing div as the most reliable way of clearing floats. We use a clearing div to clear floats so that nothing stacks beside it. We also talk about our video on Understanding the Float Property which has detailed information on how clearing divs and float properties

How to Align Text and Images in a Text Widget

Difficulty Level -

Filed Under Topics - , , , ,

Listed Under Lesson Subjects -

In this session we show how to align text and images in a text widget using CSS rather than HTML. We assign the class alignleft to the image in the text widget and discuss the use of the position property and how to use floats and the pseudoclass after. Member: Great, great. Just one quick

Customize Next & Previous Posts Links – Part 5 – Style Custom Post Navigation

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects - ,

Applies to -

This is the 5th in an 8 part series that shows how to customize the Next Post/Previous Post links in Thesis. Now that we have created our own next post/previous post image links we are going to add css styles to them so that they will be properly aligned. We use the float property to

Understanding the Float Property

Difficulty Level -

Filed Under Topics - , , , ,

Listed Under Lesson Subjects -

In this video we discuss the CSS float property.  We discuss what the float property is and how it affects the normal flow of HTML elements.  We look at what happens to an HTML element that is defined as float:left;  We consider various combinations of floats, element sizes and margins for arranging HTML elements on