Skin Causes Widgets to Display Incorrectly
2 posters
Page 1 of 1
Skin Causes Widgets to Display Incorrectly
For some reason, the *Q001*Invision_ skin, found on page 2 of the Hitskin tab, causes erratic widget positioning. Sure, we could switch to a different skin, but the founder and I love the metal effect.
The Issue
As shown above, the widgets interfere with the page content. They should both be displayed outside the metal edges of the skin, but they aren't. In fact, it cuts off the metal background for the rest of the page, which defeats the purpose of the skin.
Oh, I also couldn't find how to get rid of the gap in the skin that shows the fire background. I tried out various things in the CSS, but it didn't do anything.
Forum Address: http://phoenixdueling.forumakers.com/
Any help on getting the widgets to display in the proper position will be greatly appreciated!
The Issue
As shown above, the widgets interfere with the page content. They should both be displayed outside the metal edges of the skin, but they aren't. In fact, it cuts off the metal background for the rest of the page, which defeats the purpose of the skin.
Oh, I also couldn't find how to get rid of the gap in the skin that shows the fire background. I tried out various things in the CSS, but it didn't do anything.
Forum Address: http://phoenixdueling.forumakers.com/
Any help on getting the widgets to display in the proper position will be greatly appreciated!
Mnslayer27- New Member
- Posts : 15
Reputation : 1
Language : English
Re: Skin Causes Widgets to Display Incorrectly
Hi!
Add to CSS Stylesheet:
About the widgets, I don't see them.
Add to CSS Stylesheet:
- Code:
div#logostrip{
top: 20px;
position: relative !important;
}
div#submenu{
position: relative !important;
top: 20px;
left: 100px;
}
About the widgets, I don't see them.
Re: Skin Causes Widgets to Display Incorrectly
Ty for fixing the gap. I turned off widgets cause it made the site look ugly. I'll turn back on so you can get a better idea of the issue. I'll post so the users know why.
Btw, turning widgets on causes the whole distortion effect. With widgets off, every element is in its proper place.
Btw, turning widgets on causes the whole distortion effect. With widgets off, every element is in its proper place.
Mnslayer27- New Member
- Posts : 15
Reputation : 1
Language : English
Re: Skin Causes Widgets to Display Incorrectly
Try adding to CSS Stylesheet:
- Code:
#left{
position: relative;
right: 210px;
}
#right{
position: relative;
left: 200px;
}
#ipbwrapper {
min-width: 934px !important;
}
Re: Skin Causes Widgets to Display Incorrectly
I tweaked that CSS to get what seems to be the appropriate positions for the widgets.
Unfortunately, the section where the forum links are shown is half the size that its supposed to be, and the metal border is still cut off. I'll put the site's CSS here in case you need it. I should have just done that earlier lol. Oh, and thanks for the help so far!
Edit to avoid double-posting: Hmm, I'm a bit confused. I was notified that someone posted, but nobody has o.O
- Code:
#left{
position: relative;
right: 210px;
}
#right{
position: relative;
left: 210px;
}
#ipbwrapper {
min-width: 910px !important;
}
Unfortunately, the section where the forum links are shown is half the size that its supposed to be, and the metal border is still cut off. I'll put the site's CSS here in case you need it. I should have just done that earlier lol. Oh, and thanks for the help so far!
- Spoiler:
- Code:
/*FMChat Design*/
.chatbase { /*This can be edited to your liking - (the button)*/
position: fixed;
bottom: 2px;
right: 15px;
background: #56A0D3;
border: 2px solid #7BB92B;
width: 75px;
height: 20px;
border-radius: 5px;
text-align: center !important;
cursor: pointer;
color: #ffffff;
}
.chatbase:hover { /*This can be edited to your liking - (hovering over the button)*/
border-color: #D30C3F;
color: #000000;
}
#chat { /*This can be edited to your liking - (box surrounding the chatbox)*/
border: 2px solid #7BB92B;
width: 65%;
position: fixed;
right: 50px;
bottom: 27px;
height: 50%;
border-radius: 5px;
z-index: 999;
}
div#submenu{
position: relative !important;
top: 20px;
left: 100px;
}
#left{
position: relative;
right: 210px;
}
#right{
position: relative;
left: 210px;
}
#ipbwrapper {
min-width: 910px !important;
}
body{
background-position: center;}
div#logostrip{
background-color: transparent;
background-image: url('http://i32.servimg.com/u/f32/13/62/36/18/211.png');
background-repeat: no-repeat;
height: 404px;
width: 100%;
margin: 0px;
padding: 0px;
top: 20px;
position: relative !important;
}
#ipbwrapper{
margin-top: -4px;
margin-bottom: -4px;
}
.wysiwyg{
background-color: #1f2630;
}
#text_editor_textarea { background-color: #1f2630; color: #fff; }
#site-desc{
background-color: transparent;
padding: 0px;
margin: 0px;
}
#submenu{
background-color: transparent;
background-repeat: no-repeat;
margin:0px;
padding: 0px;
margin: -90px 0pt 30px; padding: 0px 0px 25px; /margin-bottom: 54px;}
#profile-advanced-layout{ float:none; margin: 0px; padding: 0px; width: 100%; } #profile-advanced-left{ float : none; margin: 0px; padding: 0px; width:806px; } #profile-advanced-right{ float: none; margin: 0px; padding: 0px; margin-bottom: 0px; width: 806px;} #profile-advanced-right .module{ margin-bottom: 0px; }
#submenu a:hover{
background-color: transparent !important;}
#submenu ul li a {
padding: 0px;
margin: 0px;
text-decoration: none;
color: #fff;}
#userlinks{
background-color: transparent !important;
background-image: url('http://i32.servimg.com/u/f32/13/62/36/18/111.png');
background-repeat: repeat-y;
min-height: 6px;
padding: 0px 70px 0px 70px;
font-size : 1.0em;
color: #000;
border-bottom: none;}
#userlinks.not-connected{
background-color: transparent !important;
border-bottom: 0px;}
#fa_ticker_block{
background-color: transparent !important;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/137.png');
background-repeat: repeat-y;
min-height: 6px;
border: none;
padding: 5px 60px 5px 60px;
margin-top : 0px !important;
margin-bottom : 0px !important;}
#fa_ticker_container{
padding-bottom: 2px;}
#fa_ticker{
background-image: none !important;}
div.newslink{ background-color: transparent !important;}
#outer-wrapper{
background-color: transparent !important;
background-image: url('http://i32.servimg.com/u/f32/13/62/36/18/templa11.png');
background-repeat: repeat-y;
min-height: 6px;
padding:0px;
margin: 0px;}
#wrapper{
background-color: transparent !important;
margin: 0px 55px;
padding: 30px 0px;}
#gfooter{
background-color: transparent !important;
font-size : 1.0em !important;
color: #fff !important;
background-image: url('http://i32.servimg.com/u/f32/13/62/36/18/2_0511.png');
background-repeat: no-repeat;
width: 910px;
height:249px;
margin: 0px;
padding: 0px;
/margin-top: -16px;}
#gfooter :hover {
color: #039ce2;}
.current-time{
padding-right: 15px;
margin-right: 45px;
padding-bottom: -150px;
color: #fff;}
#qjump{
padding-left: 60px;
padding-right: 5px;
padding-bottom: -150px;}
#gfooter
.footer-links{
float: left;
padding-left: 10px;
padding-bottom: -150px;}
.row1, .row2{
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f411.png');
border:1px solid #000;}
.row1:hover, .row2:hover{
background-image: url('http://i35.servimg.com/u/f35/11/95/30/70/f710.jpg');}
table.ipbtable tfoot td{
background-color: transparent;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/b1010.jpg');
padding: 0px;
height: 12px!important;
border: none;}
.tfooter{
margin: 0px;
padding: 0px;}
.post{
background-color: #1f2630;
background-image: url("http://i85.servimg.com/u/f85/11/95/30/70/b1010.jpg");
background-position: bottom;
background-repeat: repeat-x;
padding-bottom: 12px;
border: none;
margin-top: 4px;}
.postbody{
background-color: #1f2630;
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f610.png');
border-style: solid;
border-width: 1px;
border-color: #181818 #191919 #161616 #171717;}
.post-header{
background-color: transparent;
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f411.png');
border-style: solid;
border-width: 1px;
border-color: #181818 #191919 #161616 #171717;}
.post-footer{
background-color: transparent !important;
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f411.png');
border-style: solid;
border-width: 1px;
border-color: #181818 #191919 #161616 #3f4d60;}
.postprofile{
background-color: #1f2630;}
.post-container{
background-color: #1f2630;
border-style: solid;
border-width: 1px;
border-color: #181818 #191919 #161616 #3f4d60;}
.bar{
background-color: #1f2630;
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f610.png');
border: 1px solid #455255;}
.search-footer-box { display: none; } #search-box { display: none; }
.box-content{
background-color: #1f2630;
background-image: url("http://i85.servimg.com/u/f85/11/95/30/70/b1010.jpg");
background-position: bottom;
background-repeat: repeat-x;border-bottom: 0px; margin: 0px; padding: 0px;
padding-bottom: 12px;
border-style: solid;
border: none;}
.activeusers{
background-color: transparent !important;
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f610.png');
background-repeat: repeat;
border: 1px solid #455255;}
.activeusers-box{
background-color: transparent !important;
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f610.png');
background-repeat: repeat;
border: 1px solid #455255;}
.module .maintitle{
background-color: transparent !important;
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/b411.png');
background-repeat: repeat-x;
height: 27px;
padding-top: 4px;
margin-bottom: -7px;
border: 1px solid #000;}
.module .box-content{
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f610.png');
background-position: bottom;
background-repeat: repeat;
border-style: solid;
border-width: 1px;
border-color: #535353 #6b6b6b #433f3f #6f6e6e;}
.messaging-box{
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f610.png');
background-repeat: repeat;
border: 2px inset #171717;}
#smiley-box{
background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/f411.png');
background-repeat: repeat;
border: 2px inset #6f6e6e;}
.qreply{
background-color: #232d36;
border-style: solid;
border-width: 1px;
border-color: #535353 #6b6b6b #433f3f #6f6e6e;}
button.button2, input.button2 {
font-size: 0.7em;
border: 3px double #6f6e6e;
color: #381200 ;
width: auto !important;
padding: 1px 0px;
font-family: Verdana,Arial,Helvetica,sans-serif;
color: #000000;
background-repeat: repeat-x;
background-color: #FAFAFA;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/oo12.jpg');
background-position: top;
overflow: visible;
vertical-align:middle;}
button.button2:hover, input.button2:hover {
border: 3px double #6f6e6e;
color: #381200 ;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/tex111.jpg');
background-position: top;
color: #000000;
background-position: 0 100%;}
.button, .mainoption{
border: 3px double #6f6e6e;
color: #000 ;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/oo12.jpg');}
.button:hover, .mainoption:hover{
border: 3px double #6f6e6e;
color: #000 ;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/tex111.jpg');}
.exthelp,.rte-menu-button {
float: right;
height: 16px;
margin: 0.5em;
padding: 3px 5px 3px 25px;
border-style: solid;
border-width: 1px;
border-color: #535353 #6b6b6b #433f3f #6f6e6e;
background-color : #1f2630;
background-image: url("http://i85.servimg.com/u/f85/11/95/30/70/11210.png");
background-repeat: no-repeat;
background-position: 2% 50%;
font-size: 10px;
font: bold #000;
text-decoration: none !important; }
.rte-menu-button {
float: left;
font: bold #000;
border-width: 1px;
border-color: #535353 #6b6b6b #433f3f #6f6e6e;
background-color : #1f2630;
background-image: url("http://i81.servimg.com/u/f81/13/51/88/96/11411.png"); }
#navstrip li {
float: left;
margin: 0 5px;
padding-left: 14px;
background: url('http://i82.servimg.com/u/f82/13/62/36/18/1010.png') no-repeat left 50%; }
#navstrip li.begin {
padding-left: 14px;
background: url('http://i82.servimg.com/u/f82/13/62/36/18/1010.png') no-repeat left 50%;}
div.maintitle .expand,div.maintitle .contract {
float: right;
width: 12px;
height: 12px;
background: url('http://i89.servimg.com/u/f89/13/09/17/36/313.png') no-repeat 50% 50%;
cursor: pointer;
}
div.maintitle .expand { background: url('http://i89.servimg.com/u/f89/13/09/17/36/413.png') no-repeat 50% 50%;}
.popmenubutton a { background-image: url('http://i82.servimg.com/u/f82/13/62/36/18/810.png');}
ul.privmsg li {
background-color: #1f2630;
color: #000;
border: 1px dotted #000;
background-repeat: repeat;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/tex111.jpg');
background-position: top;}
ul.privmsg li :hover {
background-color: #1f2630;
color: #000;
border: 1px dotted #000;
background-repeat: repeat;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/oo12.jpg');
background-position: top;}
ul.privmsg li a{
background-color: #1f2630;
color: #000;
border: 1px dotted #000;
background-repeat: repeat;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/oo12.jpg');}
ul.privmsg li a:hover{
background-color: #1f2630;
color: #000;
border: 1px dotted #000;
background-repeat: repeat;
background-image: url('http://i85.servimg.com/u/f85/11/95/30/70/tex111.jpg');}
#navstrip {
color: #015ca8;}
#navstrip li a:hover{
color: #4aa5f2;}
.search-menu{
color: #fff;}
.post .popupmenu{
background-color: #1f2630;}
.postprofile-head ul li{
background-color: #1f2630;
border: 1px dotted #6f6e6e;}
.topic-footer{
background-color: transparent;}
#gfooter a {
color: #4c7bbc ! important;}
#gfooter a:hover {
color: #fff ! important;}
#i_icon_mini_index{width:81px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0111.png) no-repeat 0 0;}
#i_icon_mini_index:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0111.png) no-repeat 0 -30px;}
#i_icon_mini_portal{width:68px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0411.png) no-repeat 0 0;}
#i_icon_mini_portal:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0411.png) no-repeat 0 -30px;}
#i_icon_mini_gallery{width:68px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0311.png) no-repeat 0 0;}
#i_icon_mini_gallery:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0311.png) no-repeat 0 -30px;}
#i_icon_mini_calendar{width:69px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0210.png) no-repeat 0 0;}
#i_icon_mini_calendar:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0210.png) no-repeat 0 -30px;}
#i_icon_mini_faq{width:52px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0510.png) no-repeat 0 0;}
#i_icon_mini_faq:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0510.png) no-repeat 0 -30px;}
#i_icon_mini_search{width:68px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0610.png) no-repeat 0 0;}
#i_icon_mini_search:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0610.png) no-repeat 0 -30px;}
#i_icon_mini_members{width:68px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0711.png) no-repeat 0 0;}
#i_icon_mini_members:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0711.png) no-repeat 0 -30px;}
#i_icon_mini_groups{width:68px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/re_0810.png) no-repeat 0 0;}
#i_icon_mini_groups:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/re_0810.png) no-repeat 0 -30px;}
#i_icon_mini_profile{width:68px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0911.png) no-repeat 0 0;}
#i_icon_mini_profile:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_0911.png) no-repeat 0 -30px;}
#i_icon_mini_message{width:52px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_1011.png) no-repeat 0 0;}
#i_icon_mini_message:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_1011.png) no-repeat 0 -30px;}
#i_icon_mini_new_message{width:52px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/anim_111.gif) no-repeat 0 0;}
#i_icon_mini_new_message:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/anim_111.gif) no-repeat 0 -30px;}
#i_icon_mini_logout{width:76px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_1110.png) no-repeat 0 0;}
#i_icon_mini_logout:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/nav_1110.png) no-repeat 0 -30px;}
#i_icon_mini_register{width:68px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/anim_011.gif) no-repeat 0 0;}
#i_icon_mini_register:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/anim_011.gif) no-repeat 0 -30px;}
#i_icon_mini_login{width:76px;height:30px;background:url(http://i32.servimg.com/u/f32/13/62/36/18/on_1110.png) no-repeat 0 0;}
#i_icon_mini_login:hover{background:url(http://i32.servimg.com/u/f32/13/62/36/18/on_1110.png) no-repeat 0 -30px;}
.maintitle.floated.dropped{padding-bottom:0px;}
#topicmenu-options{
height: auto;}
table.ipbtable { border: 1px solid rgb(39, 39, 39); }
table.ipbtable th {
overflow: visible;
padding: 3px;}
div.errorwrap,div.infowrap{
background-color:#b6c5d2;
border:3px solid #011d42;}
div.errorwrap h4,div.infowrap h4{
background-color:#12376b;
border:1px solid #b6c5d2;
color:#b6c5d2;}
div.errorwrap p,div.infowrap p{
color:#011d42;
font-weight:bold;}
div.errorwrap p a:link,div.infowrap p a:link{color:#f0661b;text-decoration:underline;}
div.errorwrap p a:link:hover,div.infowrap p a:link:hover{color:#b72b00;}
.member{background-color:#b4cbe3; border:1px solid #23201b;}
.member-header{background-color:#4c7bbc; border:1px solid #c5d6e7; }
.member p{background-color:#2c435b; border:1px solid #23201b; padding:3px; margin-top:10px; color:#c5d6e7;}
.member .popmenubutton-new-out a{background-color:transparent;border:none;color:#c5d6e7;}
.member .popupmenu{background-color:#b4cbe3;border:1px solid #6c6657;}
.member .popupmenu ul{background-color:#b4cbe3;border:1px solid #6c6657;padding:3px;margin-top:10px;color:#c5d6e7;}
.member .popupmenu li{background-color:#2c435b;border:1px solid #2d2d2d;}
.member .popupmenu li a.profile-icon{float:none;height:22px;margin:0px;padding-left:3px;}
.post-footer img { padding-left: 5px;}
Edit to avoid double-posting: Hmm, I'm a bit confused. I was notified that someone posted, but nobody has o.O
Mnslayer27- New Member
- Posts : 15
Reputation : 1
Language : English
Mnslayer27- New Member
- Posts : 15
Reputation : 1
Language : English
Similar topics
» [Help]how to display widgets on the right like in this forumotion!
» Widgets dont display on the right?
» Display Widgets only on Home Page ???
» I can not display the widgets on my phpBB3 forum
» Glowing red skin has no Forum widgets option.How can I fix this?
» Widgets dont display on the right?
» Display Widgets only on Home Page ???
» I can not display the widgets on my phpBB3 forum
» Glowing red skin has no Forum widgets option.How can I fix this?
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum