Denny Beulen
Denny Beulen

Reputation: 123

Css positioning in joomla 1.5 template

I've been trying to make a joomla template with on the left and on the right a bar with fixed width. the main div should be responsive.

I managed to create the layout what i want here: http://dennybeulen.nl/rena/nl/over-ons.html

The only thing what is not working is the menu on the left side. When i change the css the menu works, but the layout is not right anymore.

the menu is working if i make these changes (just removed the '-' in front of 130):

div.fluid{
     margin-left: 130px;
}

hope somebody can give me some hints.

Upvotes: 0

Views: 56

Answers (2)

C3roe
C3roe

Reputation: 96151

@gaynorvader is right in that your middle container lays on top of the menu. Instead of positioning it absolute, you could also just leave everything as is, and only add position:relative;z-index:1 for div.left.

Upvotes: 0

gaynorvader
gaynorvader

Reputation: 2657

Looks like div.fluid is covering your left column. Try making div.left absolutely positioned and setting your div.fluid to having no left margin:

div.fluid{
    float: left;
    width: 100%;
    margin-right: -290px;
    margin-left: 0px;
}
div.left{
    position: absolute;
    width: 130px;
    min-height: 1px;
    padding-top: 10px;
}

Keep in mind, div.left will no longer affect elements floating against it.

Upvotes: 1

Related Questions