Need Help by my Design - Better Battlelog Forums #1738

Hello all!
everybody who can understand german should read this topic here:,0,0,11512,9999#l
all others should continious at this point.

i have created my new template for my ooold blog.
for more details please check this topic:

now i have two problems:
1.) Display: Inline; and Vertical-align: middle;

Why didn't work the vertical-align definition for the black box with the radius on the left, bottom side? currently its not included but the problem is the same. the same happens if i use for the mother element "display: inline;"

2.) the content boxes in the middle (i give them a background color in different greys, so you can see them better), one of them, the right one, have the picture included.

if i use by the picture right: xxx px; it didn't make a different as i would use left: xxx px;. whats wrong here? if i write left or right... always it will be placed from the left side.

hope you can help me a little bit :-S

didn't work with HTML and CSS for a long time and myybe i have forgotten some points...
1. Only elements can display vertical-align: correctly.
2. To easy positioning a background image use:
background-position: top left;
background-position: 10px 10px;

German Reference:
brain wrote:
1. Only elements can display vertical-align: correctly.

ohh okey i didn't knew that.

2. To easy positioning a background image use:l

thats not my problem. background are not a problem (like you see on different places) the problem is with the div and the image and the position of the div in the parent div.
ORFK wrote:

2. To easy positioning a background image use:l

thats not my problem. background are not a problem (like you see on different places) the problem is with the div and the image and the position of the div in the parent div.

Put your image as image background in your div, using the code above.

It's wordpress (or template to wp)?
yeah thats not really the problem, it have do to with the div.
i dont know why but when there is a "float" and/or a "position realtive" i cant use the right side as references from the parent element.

i have always to made the relations to the left side. but now i have "solved" it i will work with margin, so i can use for the width 100% of the parent element and can change it more easier.
You never should combine float and position at the same time.
Float is per defination a specific position model and a combination of that will always result in unexpected problems.
but if i have two or more rows with different and always variable content i have to work with this, it i want that everythink is next to the other :-/
Why you don't use a framework?

or something else?
why should i? like i know is a framework a library for often used elements. i never worked with frameworks, so please explain it for me =D
Is more usefull. You can pay attention only in design, 'cause framework do the rest.

Why should I use a framework?

Do you feel like you spend a good amount of time designing, then an equal amount of time coding those designs? With frameworks, you can cut your coding time down by half. Why half? With a framework, you can knock out the basic layout using a grid system which is cross-browser compatible (ie6, ie7, FF, Safari, Chrome) and then focus on your custom style sheet.

How to use a framework?

The first time I used Blueprint, I started using it after I had designed my page – I was essentially retro-fitting Blueprint to my design. I would not recommend using Blueprint in this way, I felt restricted and was annoyed with Blueprint. I ended up making it work, but wasn’t ultimately happy. The best way to use a framework is from the beginning, before you start designing setup your grid – it makes a world of difference! Blueprint has some great resources for setting up grids for use in Photoshop and Illustrator.

When to use a framework?

Anytime! I have been using the 960gs framework for landing pages because of its small footprint (3.6kb) and quick ability to get up and running. I love the confidence of knowing the layout will work cross-browser, so it allows me to get my designs up and running fast (very important! in web).


In my case, i start test the Twitter Bootstrap + Wordpress. I have a friend testing the 960Grid. Both works with WP, btw.
ok, i will take a look.

so but now...
how will it help me... i think i my content i have two columns, not more.
except the navigation and footer. for what should i use now the grid?

why is it so good to use it?
Not needed help anymore, but i have now a compelte new design
Header and Logo is not completed yet, but the generall content area, sidebar and dynamic moving ist builded in.

so you have the exclusive right to see my pre-Beta.
please rate it and give me a feedback. (pls remember: i working a lot with space holder)
i think i will reorder a littel bit my website this evening... =)
be ready to check out tomorrow a new pre-beta