Grow your CSS skills. Land your dream job.

Weird CSS issue when resizing browser

  • # January 27, 2011 at 1:41 pm

    Hi All,

    I’m working on a website, I’m fairly new to css, been using it for about a year on and off and the issue I’m having is when you goto the site and you decide to make the browsing window smaller the right side gets cut off and shows a white background/image over the side of the page. I’ve been trying to figure out how to fix this problem, but I’m coming up with nothing. Does anyone have an idea where I went wrong and how to fix it.

    Thanks in advance

    # January 27, 2011 at 2:50 pm

    I think I remember contacting @ChrisCoyier about this, as his personal site has the same issue in the header. You can ‘fix’ this by declaring ‘width: 100%’ and ‘display: table’ on ‘div.post_header’.

    I have no idea why it works or where I found this!

    # January 27, 2011 at 3:23 pm

    just add min-width: 1318px; to .post_header

    # January 27, 2011 at 3:31 pm

    Oh my days!! :).. thanks a lot
    works like a charm

    # January 27, 2011 at 5:03 pm

    I have only to say that you have bug (

    # January 28, 2011 at 11:49 am

    great thanks alot!!

    cheers

    # January 31, 2011 at 11:39 am

    I just got one more issue I can’t seem it figure out
    on the website under current deals
    you notice especially in IE8 and chrome the little orange table block that says “you pay” doesn’t line up properly all the time. When you scroll down even more to the end it gets completely cut-off.

    What am I doing wrong here. I tired padding and it doesn’t seem to make a difference

    Thanks in advance!!

    # February 1, 2011 at 1:04 pm

    Also on the main page the buy now button is out of place in Firefox
    anyone know how I go about fixing this issue, I cant seem to figure it out.

    Thanks in advance again. :)

    bump: nevermind I figure out the issues

    margin:9px 0 0 90px;
    and
    padding:26px 0 0 1px;

    and the width wasn’t entered in

    thanks again for the help

    # March 2, 2011 at 3:52 pm

    does anyone have any suggestion for the logo issue I’m having at the top.
    When I open the site full screen the logo is align properly, but If I start to shrink the browser size it starts to shift.

    Any thoughts on where I went wrong TIA :)

    # March 2, 2011 at 6:09 pm

    If you want the page in the center no matter the size, in your main div, the one containing all your content just add in the CSS

    margin-left:auto;
    margin-right:auto;

    # March 3, 2011 at 12:05 am

    @dornedain I’ll give that a try thanks alot

    # March 4, 2011 at 1:13 pm

    doesn’t seem to be working.:( it still seems to shift when I set the properties that way

    # March 14, 2011 at 4:52 pm

    anyone have any idea what I’m doing wrong at this section?
    also in IE7 the top border image of the body just goes missing.

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".