1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Other CSS/HTML Question (Probably Simple)

Discussion in 'Software' started by whiteagle, 16 Jan 2009.

  1. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    I've decided to take my photography big time and make an attempt at going pro. I bought a wordpress template that was fairly close to what I'm going for and thought I could customize it, no problem. I've actually changed it quite a bit and just about have it, but the last 5% is absolutely driving me nuts.

    (Disclaimer: the site looks like crap right now. I've only been working on layout til now. The design stuff will be a piece of cake once I get the code finished.)

    Here's the site.

    Here's the css file.

    For some reason the bio text and right image links are aligning with the bottom of the bio picture in Firefox. It's a little closer in IE 6, though I don't know about IE 7 or Safari. (I also don't know how to get rid of the white stripe between the banner and the, currently pink, menu bar.

    It's all in a 3 column table.

    Honestly, what I'm shooting for is something closer to this. Also, after I get this done I'll replace the banner with a flash banner. If that's going to create any unforeseen problems with the current code, feel free to speak up.

    I've been through the entire CSS file several times and can't find anything that would make it do that. I've spend a few days working on it, but I'm about ready to give up.

    Thanks for any help. Just got married in October and layed off right after our honeymoon. I'm hoping this will help start a better future for us.
     
  2. identikit

    identikit Minimodder

    Joined:
    5 Jun 2004
    Posts:
    1,322
    Likes Received:
    16
    Sigh, that's a really strangely coding site to be looking up to. (Also passwording the full post but making each hidden image filename sequential :hehe: )

    Everything you want to do can be easily done in a few minutes with K2 and some extra nifty code.

    For the code can you knock up a quick mspaint of how you want the layout to look.
     
  3. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    I agree his site is kinda funkily coded. I'm really just interested in the bio section of his site up at the top. He just does passwords for the nude shoots. The passwords are in the posts. But like I said, I just like his general bio layout at the top.

    What's K2? Wikipedia doesn't seem to have an article on anything software related named K2.

    I've got to leave where I'm at in just a few minutes, but I'll try to get that out before I go.
     
  4. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    Made it. Thanks for any help you can supply.

    Here's the mockup.

    [​IMG]
     
  5. identikit

    identikit Minimodder

    Joined:
    5 Jun 2004
    Posts:
    1,322
    Likes Received:
    16
    Ah didn't read the text, was too busy trying to get the money shots :blush:

    http://getk2.com/

    http://getk2.com/about/
     
  6. Firehed

    Firehed Why not? I own a domain to match.

    Joined:
    15 Feb 2004
    Posts:
    12,574
    Likes Received:
    16
    I'm not at my coding computer right now, but in the main area where you've got the bio, you'll want code roughly like:

    <div id="bio_wrapper">
    <img src="path/to/img.jpg" id="bio_image" alt="alt text" />
    <div id="bio_text">Your bio text</div><!--#bio_text-->
    <div id="bio_links">
    <ul>
    <li><a href="wherever.html"><img src="path" alt="your first link" /></a></li>
    <li><a href="wherever.html"><img src="path" alt="your second link" /></a></li>
    </ul>
    </div><!--#bio_links-->
    </div><!--#bio_wrapper-->

    CSS:
    #bio_image { float: left; }
    #bio_text { width: 500px; }
    #bio_links { float: right; width: 200px; }
    #bio_links li { display: block; margin-bottom:5px; float:left; }

    Untested, no guarantees, etc, but I think it should put you somewhere in the right vicinity.
     
  7. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    I finally got a chance to update it, but it didn't work. Any other ideas? I'm fine with it being layed out with tables as opposed to CSS if that makes life easier. I just can't figure out why it was aligning weird with tables.
     
  8. voodoo2k4

    voodoo2k4 Ghetto Modder

    Joined:
    21 Apr 2004
    Posts:
    316
    Likes Received:
    2
    Came for the code...

    ...Stayed for the naked chick!
     
  9. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    Bump. I still really need help with this thing please.

    By the way, the local grocer started selling HP sauce, so my wife and I did a fry up for dinner tonight (minus the black pudding). I'm about ready to head to the other side of the pond. It was wonderful.
     
  10. BentAnat

    BentAnat Software Dev

    Joined:
    26 Jun 2008
    Posts:
    7,230
    Likes Received:
    219
    What firehed said should've worked, really...
    didn't have tome to test now, but it should work. Only thing that might cause problems could be the bio-text getting hidden under the image. to avoid that, i'd make the bio text float:left as well.

    Best recommendation i have is to learn the synergy between CSS and HTML.
    http://www.w3schools.com/css/default.asp
     
  11. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    I think I'm fairly comfortable with CSS/HTML, but it just isn't working like everyone seems to agree it should.

    It's running with firehed's suggestion right now. www.danielroberts.us
     
  12. Shuriken

    Shuriken same christmas AV for a whole year

    Joined:
    1 Jan 2003
    Posts:
    1,312
    Likes Received:
    22
    +1 on the badly coded template (I know that's not your fault though)

    Put these lines in the CSS, should fix it:
    Code:
    #bio_wrapper img
    {
      float: left !important;
    }
    
    #bio_text
    {
      float: left !important;
    }
    
    #bio_links
    {
      float: left !important;
    }

    It worked on a local copy I made, it'll need some padding and stuff to neaten it up.

    Proof:[​IMG]

    If you want some professional help neatening it up and ensuring cross browser compatibility, drop me a PM, you can see some of my work from the link in my sig.
     
  13. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    Updated it and it's still broken. To be honest it's gotten to the point where it's time to give up and create my own theme. I don't know if I'm comfortable enough with the php to do it, but dealing with this weak excuse of a theme has got to stop.

    Thanks for all the help. I guess some things just aren't worth fixing.
     
  14. Shuriken

    Shuriken same christmas AV for a whole year

    Joined:
    1 Jan 2003
    Posts:
    1,312
    Likes Received:
    22
    Ahhh, just discovered that the css file you posted is not the one active on the site like you posted, so while my code worked for the active site, it doesn't work with your custom css file.

    Give my five minutes, I'll see what I can do :)

    Update:

    Right, that css file is a bit of a mess, so I didn't have time to really sort it. But heres a link to a version of the file the file that works: Style sheet

    One thing I did notice was you were referencing the image as #bio_image in the style sheet, but the images id is actually #bioimage.

    Anyway, hope this one helps you :)
     
    Last edited: 28 Jan 2009
  15. whiteagle

    whiteagle What's a Dremel?

    Joined:
    28 Aug 2003
    Posts:
    117
    Likes Received:
    0
    Wow, you are my hero. IT WORKS!!!

    Seriously though, you just made my day. I've got tons of posts ready to start putting up there but until I got past this, I was pretty much stuck. You are awesome!
     
  16. Shuriken

    Shuriken same christmas AV for a whole year

    Joined:
    1 Jan 2003
    Posts:
    1,312
    Likes Received:
    22
    No worries, I'm always happy to help. :D

    You should definitely carry on learning the web development skills though, if I'm brutally honest, that theme is really horribly coded, and with a few months learning you'd be able to cook up something much better yourself :thumb:

    Good luck with the photography business.
     

Share This Page