How do you Centre the banner images? SOLVED
-
-
- Philip Warr
- Rocketeer
- Posts: 77
- Thanks: 0
-
Hi, Can anyone show me how to centre the banner images on my clients website
www.didcottownfc.com/
At the moment the module is set for Position 4, and as you can see the images are always ranged left.
I hope someone can show me how to adjust this.
Philip - Last Edit: 18 years 3 months ago by Philip Warr.
- Warrdesign: Graphic Design, Advertising,
Illustration, Corporate Identity, Publicity,
Magazine Design, Multimedia & Website Design
-
-
-
- Dan L
- Elite Rocketeer
- Posts: 1453
- Thanks: 0
-
It's actually mounted in position 1.
I'm not sure how the template is set up for this, but you may actually need to remove the lines of code to generate User2 and User3 to allow full-width in that area, then add a line of code in the CSS file to center-align the contents of that particular DIV. I'm afraid unless you're familiar with template coding and CSS it may not be easy.
I have a feeling though that the template is coded to fully collapse User2 and User3 if there's nothing there; so you may just be able to get away with a center-align in the CSS. Failing that, you could try adding a center-align within the actual banner module code.
By the way, the site needs a bit of adjustment in IE6 - looks fine in FF - but in IE the menu DIV needs lowering and the header image has no transparency. - Toolbox Digital | Dribbble | Forrst
-
-
-
- Mike Brandonisio
- Hero Rocketeer
- Posts: 476
- Thanks: 5
-
Hi,
In the CSS make a copy ofand call it something like div.moduletable-centerBanner. So your copy should look like this:div.moduletable h3 { margin-left: -8px; margin-right: -7px; border: 0px solid #f00; margin-bottom: 5px; height: 29px; line-height: 29px; font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-transform: uppercase; text-indent: 8px; color: #2B3036; }div.moduletable-centerBanner { margin-left: -8px; margin-right: -7px; border: 0px solid #f00; margin-bottom: 45px; height: 29px; line-height: 29px; font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-transform: uppercase; text-indent: 8px; color: #2B3036; text-align: center; }
Add the last entry: text-align: center;
Now go the the banner module in Joomla and add this to the module-sufix: -centerBanner
and save. That should do it. The above CSS is not from PixelPerfect it is from Bubblicious. Look for div.moduletable in your CSS.
Sincerely,
Mike -
www.jikometrix.net
JIKOmetrix - Reliable web hosting
-
-
-
- Philip Warr
- Rocketeer
- Posts: 77
- Thanks: 0
-
Well done Mike, that worked!
best regards
Philip - Warrdesign: Graphic Design, Advertising,
Illustration, Corporate Identity, Publicity,
Magazine Design, Multimedia & Website Design
-
-
-
- Philip Warr
- Rocketeer
- Posts: 77
- Thanks: 0
-
Dan L wrote:
It's actually mounted in position 1.
I'm not sure how the template is set up for this, but you may actually need to remove the lines of code to generate User2 and User3 to allow full-width in that area, then add a line of code in the CSS file to center-align the contents of that particular DIV. I'm afraid unless you're familiar with template coding and CSS it may not be easy.
I have a feeling though that the template is coded to fully collapse User2 and User3 if there's nothing there; so you may just be able to get away with a center-align in the CSS. Failing that, you could try adding a center-align within the actual banner module code.
By the way, the site needs a bit of adjustment in IE6 - looks fine in FF - but in IE the menu DIV needs lowering and the header image has no transparency.
How do I make the tweaks for IE6?
Thanks for your help
regards
Philip - Last Edit: 18 years 3 months ago by Philip Warr.
- Warrdesign: Graphic Design, Advertising,
Illustration, Corporate Identity, Publicity,
Magazine Design, Multimedia & Website Design
-
-
-
- Mike Brandonisio
- Hero Rocketeer
- Posts: 476
- Thanks: 5
-
Hi,
No sure how to deal with those tweaks. I know that some of the existing templates have IE tweaks like Sublte trooper. You might look to see how Andy made them.
Mike -
www.jikometrix.net
JIKOmetrix - Reliable web hosting
-
-
-
- Dan L
- Elite Rocketeer
- Posts: 1453
- Thanks: 0
-
Philip Warr wrote:
How do I make the tweaks for IE6?
Thanks for your help
regards
Philip
Open the template's CSS folder and find edit the file called "template_ie.css" - this contains IE6 specific CSS 'adjustments' - the file is called from index.php and loads after the main template_css.css file.
Anyway, you need to edit this part which is already in the file:
div#nav { position: absolute; top: 98px; left: 12px; }
Increase the top value until the nav elements are correctly positioned - 12-15 pixels should do it.
As for the logo - I'd be seriously tempted to drop it down a few pixels and use a flat colour. Transparencies just don't work in IE6.
Cheers
Dan - Toolbox Digital | Dribbble | Forrst
-
-
-
- Philip Warr
- Rocketeer
- Posts: 77
- Thanks: 0
-
Sorted,
Many thanks Dan
regards
Philip - Warrdesign: Graphic Design, Advertising,
Illustration, Corporate Identity, Publicity,
Magazine Design, Multimedia & Website Design
-
-
-
- Robert Sonnabend
- Rocketeer
- Posts: 80
- Thanks: 0
-
Hi guys,
how do I do this centering thingy with BENTOBOX? I tried to find a corresponding entry in the CSS but failed misserabely :'(
All I want is to be able to center the banner. I´m helping a friend with his site: baufinanzierungsinstitut.de/
Thanks in advance and greetings from germany,
Robert - Last Edit: 17 years 11 months ago by Robert Sonnabend.
-
Time to create page: 0.077 seconds