I'm struggling with a simple CSS "Margin" Shift!!

I've spent about a week trying to figure this one out with no luck - so I'm coming to my trusted DP CSS gurus!

I'm ashamed to even call myself a webmaster because I can't do this simple CSS edit! Anyways, embarrasment aside; the problemo.

If you visit the link in my signature (teenproblogger) you can see the big blue twitter bird -I need to move to upwards so its feet are on the navigation bar, and the head/speech cloud is on the "light-gray" header image.

it's a simple CSS edit with like "margine -10px" or something, but everything I tried fails.. can someone please tell me both the HTMl & CSS code?

Thanks

 

Add this to your css, at the end:

.twiimg { position:relative; top:-85px; }

Code (markup):

That's it.

 

Awesome, appreciate it Ulquiorra,
I"ll test this out when I get back - about to go out.

Thanks buddy

 

It worked to a certain level. The bird-image moved fine but there's still a gap (which is shown in red);

 

Add:

position:relative;
top:-60px;

Code (markup):

In your #wrap and #footer css. Alternatively, you can absolute position the twitter bird.

 

Thank You sir! +repped

The absoulete position worked a charm, had to play around with the left and top margins but eventually got it placed

 

The position:relative is NOT going to work in IE as is. Case in point your birdie is appearing way off to the left side of the screen.

I rarely use absolute positioning, but in this case I'd seriously be considering it... that or the negative margin. Margin-top:-60px; combined with position:relative; should move it, with the position:relative changing the depth sorting.

The problem with position:relative is you end up reliant on the natural flow position of the element, and said element's 'flow box' is not moved, hence that 'gap' you had.

Though as I've already said to ten other people today, with 56 validation errors you do not have HTML, you have gibberish, and with 68k of markup for 17k of content, you have three to four times as much HTML as needed for such a simple page - further exacerbating any layout issues.

 

Just put it in your sig, deathshadow

 

The position absolute worked a charm!
Thanks buddy appreciate your helpp

@deathshadow - so positive:relative WON't work with IE?

 

Yep, I saw that. Thanks for the rep

 

No worries, you deserve it
I'd rep you again but doesn't let me

cause technically speaking - you helped me twice

 

position:relative; top:-85px;