Back Home

Open Designs

Community. Driven.

General Talk: CSS Help.. Wanna give it a shot?

Bottom of Page

1 to 7 of 7

  1.  
    • CommentAuthorRyan
    • CommentTimeMar 27th 2008
     
    Hey folks,

    I'm trying to create a "discount listing" site which will display all of the discounts available to military folks in the area. Well, i'm not having problems with anything but the actual "listings" themselves. I've given it a shot a few times but keep running into snags - i'm sure it's just small stuff.

    Basically, I want each listing to look as follows.



    It will have a title and discount on the top row and address / buttons on the bottom. I use the Sweetie right arrow icon before the address and famfamfams for the other three.

    If anybody would like to take a stab at this, i'd appreciate it! I'll even throw a few bucks your way if it is super perfect. ;)

    Thanks,
    Ryan
    •  
      CommentAuthoracousticsam
    • CommentTimeMar 27th 2008 edited by acousticsam on the 28th March 2008 at 00:02:00 EDT
     
    I managed to hack something together with absolutely-positioned divs. It's a little fickle with positioning, but it's a start at least.

    Here's the ZIP file if you want to toy around with it a little...
    http://www.mediafire.com/?tmbdm0my1jv

    Edit: Screenshot for comparison...
    •  
      CommentAuthoracousticsam
    • CommentTimeMar 28th 2008 edited by acousticsam on the 28th March 2008 at 15:46:54 EDT
     
    Actually... you know what, this might be an acceptable situation to use tables. It is somewhat tabular data, after all, and tables would definitely be easier to integrate into your site than absolutely-positioned divs.

    Here's the same thing, but using tables instead:
    http://www.mediafire.com/?3m0rswzwjpi

    ...and another screenshot, for all you folks at home:


    Unless tables have you shaking in your boots, I'd use this one. It's a lot easier to change the heights and widths, and it'll play nicer in the flow of your page.
  4.  
    Heres mine: CSS Listings

    Who needs tables tongue

    You should first write some semantic (X)HTML that will break down the listing as you think it should display which will also work well with styles disabled, so here is mine for comparison:

    <li>
    	<h4><a href="" title="Johnny Joe's Seafood Shack">Johnny Joe's Seafood Shack</a> <span>10% off total purchase</span></h4>
    	<p>1010 SomewhereSomeplace Street City, State</p>
    	<ul>
    		<li><a href="" title="View our location on Google Maps">View our location on Google Maps</a></li>
    		<li><a href="" title="View local news items">View local news items</a></li>
    		<li><a href="" title="Report an error with this listing">Report an error with this listing</a></li>
    	</ul>
    </li>

    Then use CSS to style it as desired... giving the final result.
  5.  
    Dang, Christopher. Why do you have to be so good?

    I swear, everytime you post some code I learn something new. I completely forgot about CSS floats. Arghh.

    I actually copied the < head > ... < /head > from your website on my most recent template, you have all the meta tags set up so nicely...
  6.  
    i think christopher is about to get hit right in the nose with a wad of cash... that is perfect.
  7.  
    We'll see ;)

    Be interesting to see how others would have done this though, did anyone else attempt it?

1 to 7 of 7

  1.