Elegance Theme - Footer & FrontPage Content Alignment

Elegance Theme - Footer & FrontPage Content Alignment

by Usman Asar -
Number of replies: 4
Picture of Plugin developers Picture of Testers

I wonder if someone has already fixed that issue, As I just noticed when using front page content.

in standard (Non-Fluid) mode, everything aligns perfectly (Header, Frontpage Content, Main body and footer) - image attached

 

But when using Fluid Width, Header and main body does expands on larger screens, but footer and front page content area remains in standard width. (Image attached)

 

If someone had worked around this one, any help would be appreciated! Please mention in terms of fixing in theme files as so I make this change permanent.

Average of ratings: -
In reply to Usman Asar

Re: Elegance Theme - Footer & FrontPage Content Alignment

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

I think you are clever enough to work this one out Usman?

Just see which containers have the fluid settings and then realign the content that is not aligned correctly.

Best is to make a diagram using pencil and paper, that way you can see the problem and usually see a solution at the same time.

Use FireBug too that should help!

Cheers

Mary

Average of ratings: -
In reply to Mary Evans

Re: Elegance Theme - Footer & FrontPage Content Alignment

by Usman Asar -
Picture of Plugin developers Picture of Testers

Mary, Cheers! I definitely wouldn't have bothered anyone, but I spent hours trying figuring out using firebug & chrome's inspector but couldn't find a way around it, only thing I could fix was top and bottom margins but side padding was no where to be found. smile

Assuming that someone may have already had a look at it on forums so posted here.

Average of ratings: -
In reply to Usman Asar

Re: Elegance Theme - Footer & FrontPage Content Alignment

by Richard Oelmann -
Picture of Core developers Picture of Plugin developers Picture of Testers

Hadn't looked at it before, but firebug very quickly showed that

#page-footer .container {width:100%;}

and

#moodleheader .container {width:100%;}

should do the trick - although you may need to add those within @media calls depending on exactly what you want to achieve on different screen sizes. Currently that .container is set at a fixed width (which alters with @media calls) and centred. It has nothing to do with padding or left/right margin values (except them being set to auto so that the container was centred), just the .container width being a fixed pixel value.

Average of ratings: -
In reply to Richard Oelmann

Re: Elegance Theme - Footer & FrontPage Content Alignment

by Usman Asar -
Picture of Plugin developers Picture of Testers

Richard smile Thanks,
Did the trick as it should. Actually I was testing a third party responsive slider as elegance's own has weird behavior, and at fluid width, body was expanding beyond the slider so was looking odd, with 100% width everything worked for me. Thanks again!

Average of ratings: -