![]() |
4.2 column width
How do I change the left column width and move some stuff from the right to the left column?
All the information on here I can find shows width values in home.tpl but there are none in my 4.2 install :( |
Re: 4.2 column width
Please don't post questions in the bugs forum, it is for bugs and bug fixes only. Moving to Template Editing.
4.2 is css based, meaning all of the width values and everything else are in the stylesheet, main.css. Any posts on 4.1 won't help you as this is a completely different layout. Find the class that controls the side menu, and then go into your stylesheet and edit it. This looks like it: #left-bar { float: left; position: relative; width: 150px; margin-left: 7px; } |
Re: 4.2 column width
Hmm, sorry about the wrong forum thing, didn't mean to do that.
Anyways, I am trying to edit main.css and main.css in fancycategories/icons/ to get my categories list in the left column wider but its not working I changed both values as high as 180px to test and its still showing only 137px wide (i measured it). So I don't even think its using the main.css code block you posted because of fancy categories... but it seems to ignore changes I make to all the skin pages... |
Re: 4.2 column width
Did you adjust the middle column's width to account for the new width you set on the left?
|
Re: 4.2 column width
Quote:
Good question... I am looking at the file and do not see the main column's width defined anywhere. Just various containers which one even has a width of 200% however that works?! |
Re: 4.2 column width
Here's a trick, use Firebug to determine exactly which class controls each:
https://addons.mozilla.org/firefox/addon/1843 |
Re: 4.2 column width
Quote:
Installed it, its pretty neat (way over my head, but neat) I figured out what you mean though about using it to see what each section is called and broken down into. However I am still at a loss, is ALL of this coming from main.css? I made some other changes to customer/home.tpl and those changes never worked either. I just tried to comment out some sections I didn't want like the "special" section... So I am really wondering why no changes I make to anything in my skin1_original folder show up... |
Re: 4.2 column width
That's because skin1_original is not the active skin folder, skin1 is :) Skin1_original is your backup in case you botch something up in skin1.
|
Re: 4.2 column width
Oh son of a ... I see what it did ... skin1 was empty, but I never copied it back from the server!!!!!!!!
Ok, let me do that and start over and I'll post back if I need help :) |
Re: 4.2 column width
Ok, so now if I am removing a part, would you suggest I comment it out of the .tpl file and then just addust the .css file for making layout changes?
I just want to make sure I am going at this the right way... |
Re: 4.2 column width
Always safer to comment out - you may want/need it later. Just be sure to use smarty comments and not html comments. I.E.
{* Commented out code *} |
Re: 4.2 column width
Ryan,
Thank you so much for your help, I have a LOT of things working much better now. However, I have some issues with widening my left column... what part of the "main column" am I suppossed to change? Right now my page is too wide for my screen because I increased the left column by 20px. Also on fancy categories, the main.css is very hard to understand, what part do I change to make the "floating box" start the 20px further to the right? EDIT: Fancy Cat problem solved, I figured it out :) EDIT2: Ok that seemed to change problem #1 a bit ... now basically my "main column" text just starts too far to the left, the page no longer does not fit on the screen... |
Re: 4.2 column width
Haha, ok I need to try things before posting, *sigh* I fixed most of the problem, all works good except for the homepage where the speedbar goes too far to the right???
|
Re: 4.2 column width
My speedbar was too long basically, by enlarging the width % in main.css it fits, but this made me decide to look at it on smaller monitors and it was bad, so I will change my mind about how to organize my info to use less buttons. :)
|
Re: 4.2 column width
Just remember, you can't really go any wider than 1000 so that the site fits without scrolling on a 1024x768 display. I usually recommend 975 just to give a little extra room in case they don't have the browser maximized, scrollbar, etc.
|
Re: 4.2 column width
Yeah, that sounds about right.
I am still having some odd quirks with my page width though, its like it is too wide by the width of the scrollbar but only on the homepage and only until you click something?? If I have the right-bar completely turned off, should I set its width to 0px in main.css just to give the room up for everything else? What would you recommend? |
Re: 4.2 column width
Ugh it was the stupid #header .line1 .logo a img { width
I had redesigned my logo to allow the tabs to go above it so that I wouldn't cause ugly overlap issues on 1024x768, and had naturally changed the image width in the main.css to correspond to my new image size. Are there any major drawbacks to removing the width tag? The page seems to look fine without it. |
Re: 4.2 column width
Fixed all above issues, but I have a new one...
My "line3" text ... which is the breadcrumbs I think, its not clickable, isn't it supposed to be? |
Re: 4.2 column width
Make sure you didn't overlap the breadcrumbs with another <div>. That can happen if you increase the header div to be too large
|
Re: 4.2 column width
Quote:
I had changed the .printable-bar top margin (increased it from 6px to 10px) but I put it back and that didn't fix it. My new logo is 75px tall instead of 67 ... could that be the cause? I tried removing the height attribute of 75px from #header .line1 .logo a img but that didn't fix it either... perhaps the actual image is causing it? What do you think? EDIT: I changed the height attibute back to 67 (ruining my logo of course) as a test and it did not move anything up at all, so I think something else is causing it here... |
Re: 4.2 column width
Code:
#header .line1 { Is causing it. I don't remember changing that value ... but I think I obviously need the 75px if my logo is that tall, what do I do to not overlap the breadcrumb? |
Re: 4.2 column width
Ok, so I trashed the height attribute on that too and then went to
#content-container { and changed the margin-top by 10px more and its all good now. I do have a bunch of blank space I really don't like but its good enough for now. I think in a perfect world the printable page link should be on the same line as the breadcrumbs, that would look much better. |
All times are GMT -8. The time now is 12:05 PM. |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.