shek Posted May 9, 2011 Share Posted May 9, 2011 Hello everyone,I've encountered a new problem, that is, in the tabs bar on my blog there is lot of empty space . How do I remove it ?My blog : http://everything-underthe-sun.blogspot.com/See at the top, where home and privacy policy pages are embedded. I want that bar height to be reduced, so that the height is equal to the home and privacy button height. what and how to do ? Link to comment Share on other sites More sharing options...
dsonesuk Posted May 9, 2011 Share Posted May 9, 2011 1) you need to adjust the height in http://everything-underthe-sun.blogspot.com/ page .tabs-outer {background:#B6B3AD url(http://3.bp.blogspot.com/-a0Xkq2wsllA/Tcd8G0Va26I/AAAAAAAAAP4/uxLYXCU_4Cg/s1600/pagesBackground.png) repeat-x scroll 0 0;height:48px;overflow:hidden;position:relative;} 2) adjust margins inhttp://www.blogger.com/static/v1/widgets/1...ss_2_bundle.css widget {margin:30px 0;} Link to comment Share on other sites More sharing options...
shek Posted May 12, 2011 Author Share Posted May 12, 2011 oh oh.. when I did exactly what you said me, it over covered the home and privacy buttons :)as shown in the below image,I want the buttons should also go up with the reduction in the bar size.. Link to comment Share on other sites More sharing options...
dsonesuk Posted May 12, 2011 Share Posted May 12, 2011 that is due to the margin setting in widget {margin:30px 0;}you will have to reduce this to widget { margin:0px 0; }as the present margin will force it beyond the viewing area set by.tabs-outer {background:#B6B3AD url(http://3.bp.blogspot.com/-a0Xkq2wsllA/Tcd8G0Va26I/AAAAAAAAAP4/uxLYXCU_4Cg/s1600/pagesBackground.png) repeat-x scroll 0 0;height:48px;overflow:hidden;position:relative;}when the height is set below or equal to 30px. Link to comment Share on other sites More sharing options...
shek Posted May 12, 2011 Author Share Posted May 12, 2011 Amazing.. Worked like charm ! :)Thanks a lot..Can you please tell me where did you learn all this I too want to learn the advance thongs like this.. Link to comment Share on other sites More sharing options...
dsonesuk Posted May 12, 2011 Share Posted May 12, 2011 If you want advance learning for thongs? you are definitely in the wrong forum. Once you know the in and outs, of producing a html page, and applying css to achieve the design you require, you can quickly spot the areas that need amending to achieve the desired result. The use of FireFox's addon firebug is a great asset in identifying problem areas, and you can adjust css code for a page, without psychically changing the original css file.With your page, all i had to do is identify the outer container with controls the height, then the inner child element that positions the links by selecting the elements using firebug, you can then identify the css class or id of this element and styles applied, it also tells you where these styles are applied i.e a specific css file, or inline in current web page itself. Link to comment Share on other sites More sharing options...
shek Posted May 13, 2011 Author Share Posted May 13, 2011 okay got it.. so only experience and experimenting can get me through the advance learning, right? Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.