Page 1 of 1
Center sidebar_top
Posted: Tue Jun 28, 2011 7:56 am
by seraphyn
I've problem to center my sidebar_top
Code: Select all
#sidebar_top {
float: left;
width: 90%;
max-width: 920px;
clear: both;
margin-left: 5%;
position: relative;
display: inline;
margin-bottom: 50px;
-webkit-border-radius: 1em;
-moz-border-radius: 1em;
border-radius: 1em;
background: -moz-linear-gradient(#ededed, #ffffff); /* FF 3.6+ */
background: -ms-linear-gradient(#ededed, #ffffff); /* IE10 */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ededed), color-stop(100%, #ffffff)); /* Safari 4+, Chrome 2+ */
background: -webkit-linear-gradient(#ededed, #ffffff); /* Safari 5.1+, Chrome 10+ */
background: -o-linear-gradient(#ededed, #ffffff); /* Opera 11.10 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff'); /* IE6 & IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff')"; /* IE8+ */
background: linear-gradient(#ededed, #ffffff); /* the standard */
-moz-box-shadow:inset 0 0 3px #cccccc;
-webkit-box-shadow:inset 0 0 3px #cccccc;
box-shadow:inset 0 0 3px #cccccc;
}
#sidebar_top .sbcontent {
float:left;
width: 48%;
margin:10px 0 5px 10px;
}
Does someone have an idea howto fix this?
Yes, this is my first walk into theming (CSS3) without ol'school HTML ... so please be patient with me
thanks in advance
Chris
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 10:12 am
by Timbalu
Just drop
if you want to stay as is.
But the possibilities to change behaviour in other ways are quite big.
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 10:35 am
by seraphyn
Hi,
had this before, but the sidebar is not horizontal centered.
Looking with a netbook nice in the middle, looking with my thinkpad, bad.
The max-width is perfect to be in the max.
But the whole div is not centered...
Chris
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 11:13 am
by Timbalu
Code: Select all
#sidebar_top {
background: -moz-linear-gradient(#EDEDED, #FFFFFF) repeat scroll 0 0 transparent;
border-radius: 1em 1em 1em 1em;
box-shadow: 0 0 3px #CCCCCC inset;
clear: both;
display: inline;
float: left;
margin: 0 13% 50px;
width: 74%;
}
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 12:48 pm
by seraphyn
Thanks but this is not allready centered.
With 1024xN it's centered.
With higher resolutions not
See Image:
http://dl.dropbox.com/u/23011367/centered.png
Greetings
Chris
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 12:52 pm
by seraphyn
Found it:
margin-left: 17%;
margin.right: 25%;
thanks
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 2:43 pm
by Timbalu
I test it live and local (working with a quite similiar template) with 1920x1080 screen res and disabled all other things originating width and margins.
I think 25 % 16% is dirty and does not work in live/local view with FF5, you need 100% - 74% = 26% : 2 = 13%
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 2:48 pm
by seraphyn
Tested it with FF5, opera, Chromium and google-chrome.
Okay just with max 1400x because I won't go upstairs too hot.
So I'll try it later.
I think there is something other wrong in my css...
So I clean it a little bit up this night and then try it again.
Thanks for the explaination, seems like I must buy a CSS-Book for me...
Chris
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 3:04 pm
by Timbalu
ups sorry, it was res 1280x1024 monitor 1, but still valid what have said... if range is 100% = 13-74-13.
Re: Center sidebar_top
Posted: Tue Jun 28, 2011 7:44 pm
by seraphyn
Works now,
have had another wrong entry in it.
Double entries aren't nice, must clean up, now ....
Thanks
Chris
