-
Posts
-
On our home page (titled “About”), can I get suggestions for 1.) removing or making the bullets in the list invisible and 2.) moving the text descriptions upward against the thumbnails so that the long ones don’t run under the thumbnail?
I tried using alignleft, but it forced the subsequent thumbnails under the text description.
Thanks.
The blog I need help with is dorothydunnconsulting.com
Hello,
I think that the following styles will get you to where you want to be:
body.home #content .entry-content .rightcolumn > ul,
body.home #content .entry-content .leftcolumn > ul {
list-style: none;
margin-left: 0;
}
body.home #content .entry-content .rightcolumn > ul,
body.home #content .entry-content .rightcolumn > ul li,
body.home #content .entry-content .rightcolumn > ul li img,
body.home #content .entry-content .leftcolumn > ul,
body.home #content .entry-content .leftcolumn > ul li,
body.home #content .entry-content .leftcolumn > ul li img {
float: left;
}
body.home #content .entry-content .rightcolumn > ul li img,
body.home #content .entry-content .leftcolumn > ul li img {
position: relative;
top: -5px;
}
body.home #content .entry-content .rightcolumn > ul li,
body.home #content .entry-content .leftcolumn > ul li {
margin-bottom: 10px;
}
body.home #content .entry-content .rightcolumn > ul a,
body.home #content .entry-content .leftcolumn > ul a {
margin-left: 0;
}Please note that these style should only work on the home page when you are using the
rightcolumnandleftcolumnclasses.Please let us know how this works and if you have any questions about it :)
That is extraordinary. It worked brilliantly. BRILLIANT. Thank you so much!
So I was hoping to just cut and paste whatever solution you had supplied to me to also use on our SELECTED PROJECTS page. Clearly that won’t work. Can I substitute something for the string “home” in what you gave me??
I am so happy with the home page, that if you say it is problematic to work on the SELECTED PROJECTS page, I’ll just make that page single column, and still be happy.
THANKS.
You’re very welcome! Glad the code worked for you :)
So I was hoping to just cut and paste whatever solution you had supplied to me to also use on our SELECTED PROJECTS page. Clearly that won’t work. Can I substitute something for the string “home” in what you gave me??
Kind of, if you would like this formatting available throughout your whole site you can try removing the
body.homepart from the beginning of each selector. This should work rather well, but could cause a bit of confusion if you add a normal looking list inside of “left-column” or “right-column” in the future.Perhaps the best thing that we can do would be to define a custom class that you can add in addition to “left-column” and “right-column”. this way you can use normal lists where needed and the custom “thumbnail lists” on your home and selected projects pages. What do you think?
I think that would work…
OK, cool! First you will want to replace the code above with the following:
body #content .entry-content .project-column > ul {
list-style: none;
margin-left: 0;
}
body #content .entry-content .project-column > ul,
body #content .entry-content .project-column > ul li,
body #content .entry-content .project-column > ul li img {
float: left;
}
body #content .entry-content .project-column > ul li img {
position: relative;
top: -5px;
}
body #content .entry-content .project-column > ul li {
margin-bottom: 10px;
}
body #content .entry-content .project-column > ul a {
margin-left: 0;
}Then you will need to add the “project-column” class in addition to the “left-column” and “right-column” classes in the post content. Your new html should look something like this:
<div class="leftcolumn project-column">and
<div class="rightcolumn project-column">
Again, THANK YOU!
I left the front page as is — just because it was working and to leave it in case I had a a problem…and tried it only on the SELECTED PROJECT page, where it worked right away….except the two-line “Smithsonian Cooper Hewitt National Design Museum” title doesn’t line up so well. Any thoughts?
There are more specific styles for static pages in Basic Maths’ stylesheet. We can use !important to override this behaviour. Please try changing the first bit of code to:
body #content .entry-content .project-column > ul {
list-style: none;
margin-left: 0 !important;
}
Opps, sorry, that was incorrect. Here’s the correct place:
body #content .entry-content .project-column > ul a {
margin-left: 0 !important;
}
That worked like a charm to line up the text….but it reintroduced the bullets.
Strange, it looks like this rule got removed:
body #content .entry-content .project-column > ul {
list-style: none;
margin-left: 0;
}Could you try to add it back in?
Ahh. My fault: I replaced it with the last bit you sent, rather than just adding the last bit. THANKS FOR ALL YOUR HELP.
You’re welcome! Can we close this ticket as resolved?
Yes. :-D
The topic ‘homepage list: removing bullets and text postioning next to thumbnails’ is closed to new replies.
Theme Support 