Support » Themes and Templates » Moving Content; when browser is resized :(

  • I’ve read that one person adds an image so the sidebar wouldnt move.
    it worked.
    except now the “about” custom css menu moves…
    and the image overlaps the blog content…
    what can I do to resolve this problem?

    P.S
    (if you look in IE you can see part of the blog text there,
    in FF you see just a tiny dot,
    this clearly means the content is being overlapped)

    http://ohplastic.com

Viewing 15 replies - 1 through 15 (of 22 total)
  • just try resizing your browser when viewing the website.

    here is the css for the menu area;

    #menu {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 774px;
    height: 100px;
    background: url(images/menu-bg.jpg) no-repeat;
    position: relative;
    }

    #menu span {
    display: none;
    position: absolute;
    }

    #menu a {
    display: block;
    text-indent: -900%;
    position: absolute;
    outline: none;
    }

    #menu a:hover {
    background-position: left bottom;
    }

    #menu a:hover span {
    display: block;
    }

    #menu .about {
    width: 75px;
    height: 14.5px;
    background: url(***) no-repeat;
    left: 96px;
    top: 73px;
    }

    And this is what the header.php menu links look like

    <ul id=”menu”>

  • about<span></span>
  • (I blocked out the urls, hope that doesn’t affect getting any help.

<ul id=”menu”>

  • about<span></span>
  • i see the typing in the example makes a link actually pop up not the actual text in my header file.
    so i repalced href with tag

    wow, I’ve tried many times to make the text visible -_-

    <ul id=”menu”>

  • about<span></span>
  • hopefully this works?

    i just deleted the end tag to the link

    i give up.

    <ul id=”menu”>

  • about<span></span>
  • <ul id=”menu”>

  • href=”http://localhost/wordpress/about” class=”about”>about<span></span>
  • :'( omg that really gave me a head ache.

    please dont report me if multiple posts like that is not acceptable.
    i’m new to this.
    and I was only trying to make the text visible to the helpers.

    Michael

    (@alchymyth)

    Forum Moderator

    try and add a position: relative; to the style of #wrapper:

    #wrapper{
    	margin: 0 auto 0 auto;
    	width: 450px;
    	text-align: left;
    position:relative;
    }

    that way, the position: absolute of your div #sidebar is no more relative to the browser window.

    http://www.w3schools.com/css/css_positioning.asp

    🙂 let me try that right now .

    okay i’ve tried that…
    but now my side bar is where i never wanted it to be…

    Viewing 15 replies - 1 through 15 (of 22 total)
    • The topic ‘Moving Content; when browser is resized :(’ is closed to new replies.