Community Forums › Forums › Archived Forums › Design Tips and Tricks › lost widget styling
- This topic has 9 replies, 2 voices, and was last updated 11 years, 6 months ago by martin82scott.
-
AuthorPosts
-
May 6, 2013 at 6:28 am #39509martin82scottMember
Hi all im back again after someone kindly answered my question in another post this morning which is now resolved however I have another issue which id really like some help on. Again, I thank you in advance!
basically I have sleek theme with one content sidebar to the right and the homepage also has widget areas for content which is fine but long ago I edited some code and lost the decoration boxes around the widgets on the content area. The ones in the sidebar are fine. Please see link to site.
In a nutshell, I wondered if someone can point out where I find my code to get back the boxes around the homepage widgets. I assume its on css but I don't have much experience in this.
whilst we are here, my next question is, can I simply input image file location urls etc to get images in the widgets on the homepage content area?
I really do thank you in advance as its all a learning curve for me and I want to learn rather than have it outsourced.
kind regards,
martin
http://www.m-t-i.co.ukMay 6, 2013 at 7:47 am #39523wmwebdesMemberHi Martin
Do you have a copy of your original stylesheet?Styling for widget areas on home page is currently...
#home .widget {
margin: 0 0 10px 0;
padding: 10px !important;
}Look on the original stylesheet and see what the styling for #home .widget was.
If you don't have a copy of the original stylesheet download the theme to your desktop and take a look at the stylesheet.
May 6, 2013 at 7:59 am #39526martin82scottMemberThat's magic - thank you ill open it up and see differences. I hoped to of copied and pasted from sidebar but agreed your idea makes simple sense
thanks for your time.
May 6, 2013 at 8:41 am #39531wmwebdesMemberLet me know how it goes Martin.
May 6, 2013 at 9:46 am #39552martin82scottMemberThanks for your help and apologies for delayed response. it appears the last person I had do a few bits on the site may have styled the sidebar if I remember rightly now so I may not of lost the widget borders a while back. it was just my initial thought that I had.
I have checked the css but cannot locate the styling. I hope to locate and duplicate it to the content area widgets if that makes sense. the widgets are fine and live on the content area.
May 6, 2013 at 9:48 am #39553martin82scottMemberwould it be under sidebar wrapper? thanks in advance
May 6, 2013 at 9:58 am #39556martin82scottMemberwell I think I have narrowed it to this and im just trying to make sense now as to a non developer it seems a little unorganised? 🙁 :
.home-top-right input[type="text"] {width:275px; padding:5px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:1px solid #dadada} .home-top-right input[type="submit"] {padding:10px 15px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:1px solid #dadada} .home-top-right input[type="submit"]:hover {background:#333; color:#fff} .home-top-right select {width:290px; padding:5px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:1px solid #dadada;} .home-top-right textarea {width:275px; padding:5px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:1px solid #dadada}
.home-top-right .widget { width: 310px; float: right; margin: 0 0 15px 0; padding: 0; background: #FDFDFD; border: 1px solid #d9d9d9; border-radius:8px }
.home-bottom-3 .widget { width: 310px; max-width: 310px; float: right; margin: 0 0 15px 0; padding: 0; background: #FDFDFD; border: 1px solid #d9d9d9; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px }
#home .home-top-right .widget, #home .home-bottom-3 .widget { padding: 0 !important; } .home-top-right h4, .home-bottom-3 h4 { color: #222222; font-size: 14px; font-family: Arial, Tahoma, Verdana; font-weight: bold; margin: 0 0 0 0 !important; padding: 5px 10px !important; border-bottom: 1px solid #d9d9d9; background: url(images/nav.png); border-top-right-radius: 8px; -moz-border-top-right-radius: 8px; -webkit-border-top-right-radius: 8px; border-top-left-radius: 8px; -moz-border-top-left-radius: 8px; -webkit-border-top-left-radius: 8px; } .home-top-right .textwidget {padding:10px} .home-bottom-3 p {padding:3px 0 3px 10px !important; border-bottom:1px dotted #ececec;} .home-bottom-3 p a {color:#333} .home-bottom-3 p a:hover {color:#CC0000; text-decoration:none}
.home-top-right span {margin-top:10px !important;}
May 6, 2013 at 11:10 am #39570martin82scottMembermore or less solved this now but just text border issue. ill search it and report back if not
May 6, 2013 at 11:19 am #39573wmwebdesMemberGood man - looks good to me.
The CSS is reflecting the image behind the h4 tag
bottom-1 h4 {
color: #222222;
font-size: 14px;
font-family: Arial, Tahoma, Verdana;
font-weight: bold;
margin: 0 0 0 0 !important;
padding: 5px 10px !important;
border-bottom: 1px solid #d9d9d9;
background: url(images/nav.png);
border-top-right-radius: 8px;
-moz-border-top-right-radius: 8px;
-webkit-border-top-right-radius: 8px;
border-top-left-radius: 8px;
-moz-border-top-left-radius: 8px;
-webkit-border-top-left-radius: 8px;
}Shall we say that this one is resolved?
May 6, 2013 at 11:26 am #39575martin82scottMemberjust done a little more....slowly slowly catchy monkey!
yes its resolved now. ill close the thread. I have decided to scrap longer titles and put keywords elsewhere to give a title of single line text and look uninformed 🙂
you have been most helpful
kind regards
-
AuthorPosts
- The topic ‘lost widget styling’ is closed to new replies.