1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

tabless design problems

Discussion in 'CSS' started by sharpweb, Mar 1, 2007.

  1. #1
    I'm looking for some help with a tabless design. I'm a programmer and have been meaning to learn about them, but have been putting it off. Now that I need to know for the project I'm working on I don't have a lot of time to learn. So I'm taking the easy way out. Willing to pay $5 via paypal as I assume this will be any easy fix for someone that actually knows what they are doing. If you think I should be paying more don't hesitate to tell me :)

    So here's the problem:

    Site looks fine until I add the phpbb and gallery to the template...

    Looks fine:
    www.rapidadventures.com/index.php
    and
    www.rapidadventures.com/free_classifieds/

    Looks wrong:
    www.rapidadventures.com/forum/gallery2.php
    and
    www.rapidadventures.com/forum/

    The problem is that the container (1 pixel border) doesn't make it all the way to the bottom on the forum and gallery.

    Another thing I want to do is put the login box (on the right of www.rapidadventures.com/index.php) below the links on the left of the forum and gallery. I'd also like the right side of the forum to line up with the right side of the banner image at the top of the page. I realise I'll have to make the gallery narrower to fit. As long it lines up with the banner image once I resize it that will be fine....

    Cheers,
    Chris
     
    sharpweb, Mar 1, 2007 IP
  2. chopsticks

    chopsticks Active Member

    Messages:
    565
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    60
    #2
    Remove on the container the "height: 100%"... that stops the page not going so far. I'll post the other when I see it. :)
     
    chopsticks, Mar 1, 2007 IP
  3. sharpweb

    sharpweb Guest

    Messages:
    246
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thanks chopsticks that solved that problem. I knew it was easy :)

    If you can tell me how to get the login box to site under the links/photo on the left menu (see http://www.rapidadventures.com/forum/) then I will forever be in your debt :) and you will be $5 richer...

    Thanks!
     
    sharpweb, Mar 2, 2007 IP
  4. chopsticks

    chopsticks Active Member

    Messages:
    565
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    60
    #4
    I tried my own table-less one because the one you had seemed to have "hissy-fits" when I put it on the side-nav.

    I tried with the login form an I got it to go correctly on the left side in FireFox and Opera. There are mainly just problems with it in IE because of the display: block inherited from the side nav which are causing the box to be wider than it should be. I added a width: 100% for the links and the css is done inline because it seems to ignore the stuff I specify in the css file.

    CSS to add to your style.css:
    .login-form {
    	border: 1px solid black;
    	background-color: #F9F9F9;
    	width: 150px;
    	margin-bottom: 0.5em;
    }
    
    .login-form form {
    	margin: 0px;
    }
    
    .login-form p {
    	margin: 0px;
    	padding: 4px;
    	text-align: center;
    }
    
    .login-form label {
    	display: block;
    	text-align: left;
    	margin-left: 4px;
    }
    
    .login-form input {
    	margin-bottom: 4px;
    }
    
    .login-form br {
    	clear: left;
    }
    
    .login-form .check {
    	margin-bottom: 0px;
    	margin-left: -2px;
    }
    Code (markup):
    If you want to use it, remove the old login stuff and place the new stuff before this:
    		</div>
    		
    		
    		<div id="content_forum">
    HTML:
    HTML code for the Login
    	<div class="login-form">
    	  <form action="/forum/login.php" method="post" target="_top">
          <input name="redirect" value="../usercp/index.php?type=welcome" type="hidden" />
          <input name="sid" value="" type="hidden" />
          <input name="outside" value="1" type="hidden" />
    	    <p>
    		  <label for="username">Username</label>
    	      <input name="username" id="username" type="text" /><br />
    		  <label for="password">Password</label>
    	      <input name="password" id="password" type="password" /><br />
    	      <input name="autologin" type="checkbox" class="check" />Automatic Log in ?<br />
    		  <br />
    		  <input name="login" value="Log in" class="formButton" type="submit" />
    		</p>
    	    <p>
    	      <a style="width: 100%; color: #006699; font-size: 1em; font-variant: normal; border-width: 0px;" href="http://www.rapidadventures.com/forum/profile.php?mode=register" class="form-link">Register!</a>
              <a style="width: 100%; color: #006699; font-size: 1em; font-variant: normal; border-width: 0px;" href="http://www.rapidadventures.com/forum/profile.php?mode=sendpassword" class="form-link">I forgot my Password</a>
    		</p>
          </form>
    	</div>
    HTML:
    Now that wasn't the best way to not use tables with the form but hopefully it should do and it seems to look the same in FireFox 2, Opera 9 and I.E 6.0.

    Hope that solves it all. :)
     
    chopsticks, Mar 2, 2007 IP
    sharpweb likes this.
  5. sharpweb

    sharpweb Guest

    Messages:
    246
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Thanks so much for all the itme you must have put into this very good effort :)

    I'll add +++ rep. If you want to PM your paypal I'll transfer you $5 as well.

    I've resolved the issues. Your method certainly helped me along the way, but I modified it after changing my mind on the exact location of the box and what I wanted displayed.

    Thanks again,
    Chris
     
    sharpweb, Mar 2, 2007 IP
    chopsticks likes this.
  6. chopsticks

    chopsticks Active Member

    Messages:
    565
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    60
    #6
    No problem, glad to help ! Thanks for the rep too. :)
     
    chopsticks, Mar 2, 2007 IP