vb.org Archive - [HOW TO - vB4] Two column forum/sub-forum setup via CSS only

Page 3 of 6

Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vBulletin 4 Articles (https://vborg.vbsupport.ru/forumdisplay.php?f=242)

- - [HOW TO - vB4] Two column forum/sub-forum setup via CSS only (https://vborg.vbsupport.ru/showthread.php?t=228484)

Lynne

09-27-2010 02:52 PM

Quote:

Originally Posted by AliceHoward (Post 2103567)

Hmmm, something is wrong with the snippet I posted above, every now and then one of the sub-forums gets moved over somehow so an empty space appears. You can see it occurring here: http://styleorigin.com/community/for...-Mental-Health

It's only every now and then, if I refresh the page a few times it seems to right itself, obviously there's something wrong or it wouldn't dropdown.

I can't see the glitch in firefox on my mac. What is happening? Usually the issue is a border width that is throwing it off, so you can change the width to be just slightly less (there were some examples earlier in the thread) and it will be fine.

Quote:

Originally Posted by Alfa1 (Post 2103619)

Yes, I was just browsing your site, before I read your last post. I noticed that.

Does anyone know what's causing Alice's bug with sub-forums display?

What would the code be to display 3 columns? Same but 0%, 33% and 66% ?

Again, I think someone might have already posted it in here. But yeah, you wouldn't use 50%, but instead go for 33.3% or so.

AliceHoward

09-27-2010 04:24 PM

Hi Lynne, I found the problem and fixed it, this is why you are not seeing it any more, I was fixing tea for my children so haven't had time to get on until just now.

I fixed it by doing the following.

forumbits.css
FIND:

Code:

.forumbit_post .forumstats li, .forumbit_post .forumstats_2 li{

    font-size: {vb:stylevar mid_fontSize}{vb:stylevar font.units};

    text-align: {vb:stylevar right};

    padding-{vb:stylevar right}: {vb:math {vb:stylevar padding}*2};

    display:block;

}

IN-LINE FIND:

Code:

padding-{vb:stylevar right}: {vb:math {vb:stylevar padding}*2};

REPLACE WITH:

Code:

padding-{vb:stylevar right}: 5px;

Thank you again for this brilliant article, very helpful. :)

Lynne

09-27-2010 06:03 PM

Quote:

Originally Posted by AliceHoward (Post 2103789)

Hi Lynne, I found the problem and fixed it, this is why you are not seeing it any more, I was fixing tea for my children so haven't had time to get on until just now.

I'm glad you got it fixed and thanks for posting what you did. (I'd rep you if they had rep here. :) )

slinky

10-28-2010 06:37 PM

Lynne -

Thanks for the help in getting two subforums, side by side. Is there any easy way to get three to work? In my experience, that seems to be the optimal number you can use in order to condense all the vertical scrolling if you require a good number of forums and subforums. I used to have three but the subforum manager that did it now destroys validation and creates other problems when used. Having a third forum on a horizontal line would be indispensable - if you can help lead this old horse to water. :)

Bummer - I just saw what you wrote above, LOL!!!! I will try out the code now!

Confirmed... 33% works like a charm!

everfresh2

11-06-2010 07:13 PM

1 Attachment(s)

in 4.0.8 i did the same.

it is showing correctly. but above the footer area is not OK due to this CSS edits.

Please someone guide me how to fix this ?

screen shot is attached.

Lynne

11-06-2010 08:15 PM

Quote:

Originally Posted by everfresh2 (Post 2118777)

in 4.0.8 i did the same.

it is showing correctly. but above the footer area is not OK due to this CSS edits.

Please someone guide me how to fix this ?

screen shot is attached.

That isn't from the CSS here. It's from something else (you didn't update your templates after upgrading). Remove the CSS I wrote in the first post from your style and you'll see you still have that issue.

vinayak

11-18-2010 01:23 PM

Hi

Is there any way to add a sidebar on the threads page - showthread.php?

Also, can a 3-column layout be created for the forum home page? I need the page to look like this:

https://vborg.vbsupport.ru/

Thanks & Regards,
Vinayak

Lynne

11-18-2010 01:37 PM

Quote:

Originally Posted by vinayak (Post 2123179)

Hi

Is there any way to add a sidebar on the threads page - showthread.php?

Also, can a 3-column layout be created for the forum home page? I need the page to look like this:

http://img413.imageshack.us/img413/818/mylayout.jpg

Thanks & Regards,
Vinayak

Sure, but none of that has anything to do with what this thread is about.

vinayak

11-18-2010 01:43 PM

I am sorry. I thought that since this was about layout on the forum page, I put my query here.

iBaker

12-02-2010 03:28 AM

1 Attachment(s)

Hi Lynne
Great edits to the css...thanks.

I have 3 questions:
1. How do I remove the text "Sub-forums"...is removing it from the template the only way?
2. Everyone says "it's ok, just add it to the "additional.css" template...do you know if this just builds up the final css making it bigger or is it always better to try and change the existing css templates?
3. Can you think of anyway that I can keep the "Threads/Posts" and "Last Post" but have the sub forums spread across the page...like this:?

Attachment 124074

Thanks!

Lynne

12-02-2010 03:58 AM

1. I think it's a phrase. So, just edit the phrase to have nothing in it.
2. I think it really depends on how much you put into the additional.css. If it's just a normal sized template like the others, then it shouldn't be a problem.
3. I think you'd have to edit that template and put the sub-forums in their own div that doesn't include the forum title and threads/posts number. And make that div clear:both and it should go all the way across.

iBaker

12-02-2010 05:29 AM

Thanks Lynne...worked perfectly

Bram H

12-03-2010 10:51 AM

Can you apply this setting on only one category also? And can somebody post a link to a working demo?

Lynne

12-03-2010 02:01 PM

Quote:

Originally Posted by Bram H (Post 2128769)

Can you apply this setting on only one category also? And can somebody post a link to a working demo?

I think I already answered that at the beginning by saying you can add in an id there or another class to get more specific.

Sorry, but my test site is password protected, so I can only post images.

DaRK mAN306

12-06-2010 04:22 PM

Thanks Lynne ..
I like what you've done to the sub forums using css ..
I'll try to do that to the sub forums of one forum only if it works ..

Thanks again ..

Lynne

12-06-2010 04:55 PM

Quote:

Originally Posted by DaRK mAN306 (Post 2130083)

Thanks Lynne ..
I like what you've done to the sub forums using css ..
I'll try to do that to the sub forums of one forum only if it works ..

Thanks again ..

If you can't get it to work, post a link to the site and let me know which specific forum you are trying to arrange the sub forums for.

drlovelless

12-16-2010 02:06 AM

a very good modification. but I would like to know how to make the forum with only two columns in FORUMHOME (index).

anupam_luv

01-25-2011 04:44 PM

Doesnt seem to be working for me... Is there any mod to perform the same function? (with the options to choose no. of columns)

--------------- Added [DATE]1295981446[/DATE] at [TIME]1295981446[/TIME] ---------------

Quote:

Originally Posted by buiquockhanh (Post 2037793)

Help not work 4.0.3 pl1
it skewed
demo:

Im gettin exactly same problem...

anupam_luv

01-25-2011 05:05 PM

1 Attachment(s)

I added the css to additional.css but still not displaying properly...

See the screenshot attached.... plz help

Lynne

01-25-2011 05:22 PM

As I said at the beginning, this will work on a Default Style. If you changed anything like padding or margins, you will need to edit the CSS to work for you. This works just fine on my default test site. And yes, there is a mod to do it. I don't know the link or name though.

Taurus1

01-28-2011 12:45 PM

1 Attachment(s)

Quote:

Originally Posted by Lynne (Post 1971335)

You could try just setting the display to none:

Code:

.forumbit_nopost .forumhead span.forumlastpost, .forumbit_post .forumhead span.forumlastpost {display:none;}

This is awesome! Thank you so much.

Can you please tell me how to just have this not display in one category? If I add this, the "Last Post" part is gone in every category. I just want it gone in, well on my forum, cat73.

Thank you very much.

EDIT: Sorry, I got it working on the default skin, but on one of my other skins not. If you look at the screenshot attached, how can I get rid of the 'title' and the 'last post' there?

Attachment 126186

Lynne

01-28-2011 03:15 PM

I don't know what you would do on your custom skin. You'll have to ask the skin designer for help with that.

Taurus1

01-29-2011 07:48 AM

1 Attachment(s)

I figured that out too. Is it perhaps possible, and can you please help me just to move the bottom text part up, to where I indicate on the attached screen.

Thank you very much.

Attachment 126216

Lynne

01-29-2011 02:47 PM

Sorry, but I cannot write CSS from an image. It could be you have clear:both applied to that div, so remove it. I really don't know what is going on. Get firebug for firefox and you'll be able to see the CSS for that line.

DePReM11

02-21-2011 08:49 AM

How can I practice the css codes to the vbullet 3.8 system ?

Lynne

02-21-2011 03:06 PM

Quote:

Originally Posted by DePReM11 (Post 2164891)

How can I practice the css codes to the vbullet 3.8 system ?

Sorry, I don't understand the question.

DePReM11

02-21-2011 03:45 PM

https://vborg.vbsupport.ru/external/2011/02/16.jpg
can I do that in image/photo in vbullet 3,8 demand?

Lynne

02-21-2011 05:32 PM

Quote:

Originally Posted by DePReM11 (Post 2165016)

https://vborg.vbsupport.ru/attachmen...1&d=1258762752
can I do that in image/photo in vbullet 3,8 demand?

I think there is a mod to do that. You can't do it with just CSS since it is in a table.

ErnestO999

03-10-2011 10:22 PM

thanks for the code css you're woman

thanks

Wonksta

04-23-2011 11:11 AM

Lynne will this work for 3.8.6?

Thanks

Lynne

04-23-2011 04:25 PM

Quote:

Originally Posted by Wonksta (Post 2187722)

Lynne will this work for 3.8.6?

Thanks

CSS will work on any html page. You would have to adjust the class names though for 3.8.6 and I have not looked into how that would be.

BigDog007

04-27-2011 11:32 PM

Thanks for the article enjoyed it... Make sure you have a great day.

LeventX

05-12-2011 07:16 AM

Thank you...Installed.

masterross

05-21-2011 06:53 AM

Thx Lynne!

For those who wants to remove "Sub-forums:" text just add:

PHP Code:


		
			
.subforums h4 {
    display:none;
}

lostpro9het

05-22-2011 11:53 PM

Making the subforum name bold when a new post is made to it? Also, adding the thread/postcounts to each subforum title?

Lynne

05-23-2011 01:43 AM

Quote:

Originally Posted by lostpro9het (Post 2198896)

Making the subforum name bold when a new post is made to it? Also, adding the thread/postcounts to each subforum title?

You'll need to ask about this in the main forums as it has nothing to do with writing CSS to make a two column layout.

davio33

06-25-2011 08:24 AM

Quote:

Originally Posted by viarun (Post 1998486)

Adding clear:both; to the subforum listing 2-column css for this class .subforums ol.subforumlist fixes a display problem in IE7.

Im having the same issue on ie7. Im sorry but i dont understand your fix. Can someone explian this to me?

Thanks

Noerenberg

07-14-2011 07:39 PM

edit

hps5001

08-04-2011 06:04 PM

https://vborg.vbsupport.ru/external/2011/08/74.jpg

http://imageshack.us/photo/my-images/508/bwtb.jpg << Demo Link what i really want...

Hey Guys I been trying to do this on my site.. I am having really hard time making my forums display like this... Is there anyway I can display 5 side to side forums... and also its depends upon the size of monitor the person has....

So if u have 13 inch monitor u will see 3 columns and if u have 15 inch monitor u will see 5 columns.. Please help me out asap waiting for response

Lynne

08-05-2011 01:50 AM

Quote:

Originally Posted by hps5001 (Post 2229349)

http://imageshack.us/photo/my-images/508/bwtb.jpg

So if u have 13 inch monitor u will see 3 columns and if u have 15 inch monitor u will see 5 columns.. Please help me out asap waiting for response

That will require some code, not just css.

All times are GMT. The time now is 07:38 PM.

Page 3 of 6

Last »

Show 40 post(s) from this thread on one page

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01705 seconds Memory Usage 1,833KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (4)bbcode_code_printable (1)bbcode_php_printable (15)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (4)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (40)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: