You should probably use a float to position that way when the content next to them moves they don’t
Thread Starter
z_dize
(@z_dize)
how do i do that, if it could help, here is what’s inside my style sheet
/*HEADER/
.eft_header { position: relative; display:block; height:250px; width:1110px; background:url(http://www.natgroove.com/wp-content/uploads/2010/10/EFT-1.gif) center no-repeat; text-indent: -9999px; padding-right: 0px}
/*Text in 1st Box – EFT Products/
.custom #text-2 { position: relative; top:-950px; left:-685px; display:block; center no-repeat; padding-right: 0px; font-size: 18px; color: #003366;}
/*Text in 3rd Box – Free EFT Video Course/
.custom #text-4 {
position: relative;
top:-1350px; right: 28px;
font-size: 13px;
font-weight: bold;
color: #003366;
font-family: Verdana, Arial, serif;
text-align: justify;
display:block;
center no-repeat;
padding-right: 0px }
/*Subscribe Form/
.custom #af-form-981491645 { position: relative; top: -1110px; right: 30px; display:block; center no-repeat; padding-right: 0px }
/*Text in 2nd Box – Latest Articles/
.custom #recentpostswithexcerpts-3 { position: relative; top: -720px; right:350px; font-size: 11px; font-weight: bold; display:block; center no-repeat; padding-right: 0px }
#recentpostswithexcerpts-3 ul li {
background: url(http://www.natgroove.com/wp-content/uploads/2010/10/Pushpins.png) no-repeat 0px 3px;
padding-left: 28px;
margin-left: 0px;
display: list-item
}
Float wouldn’t work as those 3 boxes are from the sidebar. I think you just need to set a height so that it doesn’t go of the box.
Thread Starter
z_dize
(@z_dize)
as in putting a height attribute?
height: 000px }?
Joe
(@shopping-guide)
I had a look at your site and noticed the use of relative positioning, it appears that without this positioning the widget content appears naturally in the right sidebar, but you have shifted these up into the header into 3 separate but adjacent boxes. Wow.. this is a very bad idea and it’s not surprising to see that you are having problems with it already. Using css relative positioning to get those widgets near the top is the wrong approach, you need to modify the actual theme template files and move the sidebar include code into the header area of your template.
This may move all the contents of your sidebar into that header area, but it is the only sensible way of doing it that I’m currently aware of.
Joe
Thread Starter
z_dize
(@z_dize)
well, I was shooting for “bad idea”. 😉
I’m able to make it work, no movement when I change post titles.
The only problem I have now is how to give this particular widget a certain height so it doesn’t go out of my box. What I mean is, when I put a long title in, it would naturally concise and put the triple dots(…) instead.
Joe
(@shopping-guide)
I can only offer you sincere advice and whether you follow that is to your own benefit: the current layout positioning method you have used is fundamentally flawed and highly vulnerable to other problems now and in the future – you are only looking at your site from your own computer, on a selected browser, on a fixed size monitor screen. Just wait till you try to access your site from other PCs and mobile internet devices, that layout may very likely crumble.
You can still have your widgets showing at the top there, but you shouldn’t be moving them via css, you need to be moving the actual html elements into the header area.
Joe
Thread Starter
z_dize
(@z_dize)
could you teach me how to do that?
Thread Starter
z_dize
(@z_dize)
guys, i need help big time here. Please…
Joe
(@shopping-guide)
Your WordPress theme files will be inside a folder like /wp-content/themes/mycustomtheme/ and you can look inside the *.php files to move the html elements about, however, if you are not familiar with the basic syntax of php and html then you might struggle with it. An alternative is to find an existing WordPress theme that has the widgets placed in the header already, and then customize the design and colours to your liking.
Joe
