/    Sign up×
Community /Pin to ProfileBookmark

[URL]http://www.matthewdesmond.com/threecolumn.html[/URL]

I’ve attached a picture of the layout im trying to achieve and i cant get it right… is there a way i can achieve this layout with a bit more efficient coding?

CSS for UL

[CODE]
ul {/* menu bullet */
color: #000000;
font-size: 12px;
margin-top:5px;
list-style-image:url(“bluedot.png”);
}

result ul {/* result bullet */
color: #000000;
font-size: 12px;
margin-top:5px;
list-style-image: url(“greendot.png”);
}
[/CODE]

CSS for the results list

[CODE]
#resultlist{
width:455px;
height:50px;
margin-top:5px;
text-align: left;
background-image:url(“divider.png”);
background-repeat:no-repeat;
background-position:bottom;
}
[/CODE]

HTML Result List – green bullet

[CODE]
<div id=”resultlist”><h3>results list</h3></div>
<div id=”resultlist”><h3>results list</h3></div>
[/CODE]

[upl-file uuid=594f0d7c-3a18-4178-972f-17778660cb5d size=22kB]layout.jpg[/upl-file]

to post a comment
CSS

6 Comments(s)

Copy linkTweet thisAlerts:
@toicontienFeb 05.2007 — It looks pretty good so far. Maybe try this:
#resultlist{
width:455px;
height:50px;
margin-top:5px;
text-align: left;
[B]background: transparent url(divider.png) no-repeat scroll 50% 100%;[/B]
}

It's shorthand code for:
<i>
</i>background: COLOR url(IMAGE) IMAGE_REPEAT IMAGE_ATTACHMENT POSITION_X POSITION_Y;
Copy linkTweet thisAlerts:
@absolutmgd13authorFeb 05.2007 — awesome thanks...im havin trouble implementing the green bullet..i already have the ul{} as you can see above... how would i implement my result ul? im a CSS newbie..and not sure weather to make it ID or Class or how to implement that ul it into the resultlist
Copy linkTweet thisAlerts:
@toicontienFeb 05.2007 — Seems to be a simple syntax error perhaps? Change [B]result ul[/B] to [B]#result ul[/B], since I assume the word "result" references an HTML tag Id, rather than an HTML tag.
Copy linkTweet thisAlerts:
@absolutmgd13authorFeb 05.2007 — how would i put it into this tag?

<div id="resultlist"><h3>results list</h3></div>

the UL must be used on all results..i just cant figure out how to add them in.
Copy linkTweet thisAlerts:
@toicontienFeb 05.2007 — Given the CSS you wrote:
[code=html]
<div id="result">
<ul>
<li> ... </li>
</ul>
</div>
[/code]

You don't need that heading for this bit of code.
Copy linkTweet thisAlerts:
@absolutmgd13authorFeb 05.2007 — awesome thanks..didnt know it was that easy, i forgot about how to do that
×

Success!

Help @absolutmgd13 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.2,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...