SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Addict
    Join Date
    Nov 2004
    Location
    Canada
    Posts
    373
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to prevent this from happening?

    In the following picture I have 2 issues. The first is, depending on the resolution my header picture and the header text overlaps. With a higher resolution (which I use) it looks fine. I cant find a way to not get them to overlap other than reducing the image size a lot making it look just as weird on higher resolutions. The css tag is header for this, and the css for the text is the #header h1 and h4 tags.

    Also, how can I make my menu go all the way over to the right? For some reason there is a small gap between where the menu ends on the right. The css for this menu is there with comments in the file, it is a drop down menu I got off the net.

    Any and all help is greatly appreciated.



    css sheet at: http://usil.x10hosting.com/styleexmp.css

  2. #2
    SitePoint Guru downtroden's Avatar
    Join Date
    Dec 2004
    Location
    illinois
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    instead of making the logo a background, why not put it in the html? Float it left and then the text wouldn't overlap.
    your brain reacts in the same way whether you are
    looking at something or thinking about it...

  3. #3
    SitePoint Addict
    Join Date
    Nov 2004
    Location
    Canada
    Posts
    373
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ahh.. way to think outside the box.. stupid me.

    How about the menu issue?

  4. #4
    SitePoint Guru downtroden's Avatar
    Join Date
    Dec 2004
    Location
    illinois
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't understand this
    Code CSS:
    /*p7menubar is the root UL and p7menubar ul applies to all the sub-menu ULs.*/

    with what I can see from your setup I would have the html set up like this:
    Code HTML:
    <div id="p7menubar">
      <ul>
        <li><a href="">link</a>
          <ul>
            <li><a href="">sublink</a></li>
          </ul>
        </li>
      </ul>
    </div>

    And when I setup my css rules I would target like so
    Code CSS:
    div#p7menubar {
        height: thisMany px;
        /* width scales */
        background: #this hex color;
    }
     
    div#p7menubar ul {
    /* this is your root ul list */
        margin: 0px;
        padding: 0px;
        list-style: none;
    }
     
    div#p7menubar ul li ul {
    /* this is a submenu ul list */
    }

    And this is going from what I can see from the attached image. Do you have padding on the current ul or is there a container div with padding?
    your brain reacts in the same way whether you are
    looking at something or thinking about it...

  5. #5
    SitePoint Addict
    Join Date
    Nov 2004
    Location
    Canada
    Posts
    373
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is the html code that generates the menu..

    Code:
    <div id="menuwrapper">
    	<ul id="p7menubar">
    	<li><a href="?link=main.php"><b>Main</b></a></li>
    	<li><a class="trigger" href="#"><b>Employee Menu</b></a>
    	<ul>
    	<li><a href="?link=book.php">Submit New Request</a></li>
    	<li><a href="?link=editrequest.php">Delete A Pending Request</a></li>
    	<li><a href="?link=viewrequests.php">View Request History</a></li>
    	</ul>
    	</li>
    	<?php if(isset($_SESSION['directreports'])) { ?>
    	<li><a class="trigger" href="#"><b>Manager Menu</b></a>
    	<ul>
    	<li><a href="?link=managerrespond.php">Respond To Pending Requests</a></li>
    	<li><a href="?link=employeehistory.php">View Employee Request History</a></li>
    	</ul>
    	</li>
    	<?php } ?>
    	<?php if($hrflag > 0) { ?>
    	<li><a class="trigger" href="#"><b>HR Menu</b></a>
    	<ul>
    	<li><a href="?link=edithours.php">Input Employee Hours</a></li>
    	<li><a href="?link=viewemployeehours.php">Download Reports</a></li>
    	</ul>
    	</li>
    	<?php } ?>
                	<li><a href="?link=logout.php"><b>Logout</b></a></li>
    	</ul>
    	<br class="clearit">
    	</div>

  6. #6
    SitePoint Guru downtroden's Avatar
    Join Date
    Dec 2004
    Location
    illinois
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    okay, so try putting width: 100&#37; on the div#menuwrapper rule and if that doesn't work, then see if the containing div has a padding on it.
    your brain reacts in the same way whether you are
    looking at something or thinking about it...

  7. #7
    SitePoint Addict
    Join Date
    Nov 2004
    Location
    Canada
    Posts
    373
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The width seemed to have no effect.. there are no other divs between the menu one?

    Hmm, guess I will have to live with it, im sure i will keep looking though, the help is appreciated!.

  8. #8
    SitePoint Guru downtroden's Avatar
    Join Date
    Dec 2004
    Location
    illinois
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Do you have a page that I can look at?

    I don't understand why this isn't working.
    your brain reacts in the same way whether you are
    looking at something or thinking about it...

  9. #9
    SitePoint Addict
    Join Date
    Nov 2004
    Location
    Canada
    Posts
    373
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is just posting the code of the page fine, or do you need to be able to navigate to it? Its not on the public internet, I could maybe attatch a zip folder with the page and menu images/logos, would that be fine?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •