-
Posts
-
Hi
I am styling the icon box on this page:
http://www.copenhagenfilmcompany.dk/2014/
and need it to be narrower (900px) and centered.
When I tried this:.iconbox{
opacity:0.4;
width: 900px;
align: center;
}#top .iconbox_top{
margin-top:65px;
margin-bottom:45px;
text-align: center;
}.iconbox_icon {
display: none!important;
}it was not centered, and did not shrink on the mobile correctly.
Much appreciate it if you could help with this.
thanksthey are on that page in the middle and near the bottom – transparent overlays on an image background
Hey!
Try with this code:
.avia-builder-el-25 .iconbox{ opacity:0.4; width: 90% !important; margin: 0 auto; }To center an element you use margin: 0 auto, the width should not be set in px, but in percentage in order to keep responsiveness.
Best regards,
Josuethat is not working for me, on this page now:
http://www.copenhagenfilmcompany.dk/2014/landing_final2-2/.avia-builder-el-27 .iconbox{
opacity:0.4;
width: 90% !important;
margin: 0 auto;
}something is not right….
thanks for your help!sorry!
it’s at the bottom of this page
http://www.copenhagenfilmcompany.dk/2014/Hi!
I see i centered and it is responsive, could you create a mockup of what you want to achieve?
Best regards,
JosueI added this:
.iconbox{
opacity:0.4;
width: 90%;
margin: 0; auto;
}on this page near the bottom – now the width is right (90%) but it is not centered.
http://www.copenhagenfilmcompany.dk/2014/thanks
Hey!
Please try this:
.iconbox { opacity: 0.4; width: 80%; margin: 0 auto !important; }Best regards,
Ismaelhttp://www.copenhagenfilmcompany.dk/2014/
still not centered! I hav cleared my cache, etc.
not sure what is going on there.
?
thanksHey!
Please add following code to Quick CSS
#top .iconbox_top { margin-top: 65px!important; margin-bottom: 45px!important; text-align: center; margin: 0 auto; }Regards,
Yigitgreat that did it! thanks.
On the same page, what is the best way to move the 2 1/3 columns closer together –
the ones with the “corporate” and “short & doc” logos in them – right now I have 3 1/3 columns
with the center one empty. I need less space between them.
tried some stuff that didn’t work!
thanks
nHey!
Please try adding following code to Quick CSS as well
.page-id-5988 .avia-builder-el-23 { width: 5%; }Best regards,
Yigitthat shrunk the left logo down to 5%!
if you look here:
http://www.copenhagenfilmcompany.dk/2014/I need the center 1/3 column between the logos to be about 200px
with them all still centered.
thanksHi!
Try the following:
.avia-builder-el-24 { width: 9.333333% !important; } .avia-builder-el-20 { margin-left: 9.333333% !important; }Best regards,
JosueI added some elements to the page and so changed the designation of the avia.builders but having problems:
http://www.copenhagenfilmcompany.dk/2014/
I removed the css code as it was shrinking the logo again, and messed up other elements on other pages with avia elements of the same number.
?
thanks!Hey!
Please try adding following code to Quick CSS instead
#after_section_1 .avia-builder-el-24 { width: 9.333333% !important; } #after_section_1 .avia-builder-el-20 { margin-left: 9.333333% !important; }Best regards,
YigitHi!
The code is not being applied because it appears you have changed some elements order, therefore nulling the effect that the CSS should do.
Right now with your current setup, this is working:
#after_section_1 .avia-builder-el-27 { width: 9.333333% !important; } #after_section_1 .avia-builder-el-23 { margin-left: 9.333333% !important; }If you change that page you’d need to tweak the CSS code again, you can check the class names if you inspect those columns with the Chrome Dev Tools (el-27 is the empty middle column and el-23 is the first column).
Cheers!
Josuethat does work now, but is affecting items on this page:
http://www.copenhagenfilmcompany.dk/2014/about/ which has the same avia el-builder numbers.
How do I specify the changes only on that page (and the danish equivalent)?
ThanksHey!
#after_section_1 is ID of your Color section. You can edit the one you would like to apply the code, change its ID ( I.E.: colorsection1 ) then adjust custom CSS code as following
#colorsection1 .avia-builder-el-27 { width: 9.333333% !important; } #colorsection1 .avia-builder-el-23 { margin-left: 9.333333% !important; }Best regards,
YigitThanks – I put that code in and now it is not making the changes I wanted.
I don’t see where to find the colorsection ID – I’m looking at the INSPECT ELEMENT in google developer.I have other BIG problems now that I hope you can help me with:
Using WPML and getting 404 errors now randomly on various pages:
http://www.copenhagenfilmcompany.dk/2014/news-blog/
and also spent the whole day yesterday fixing and refixing pages and links that would then default
to the english pages (including renaming the pages and permalinks). I have just fixed them
again but the whole site seems unstable now as I am seeing all 404 errors except for the landing pages.
Any ideas what is happening here? I am freaking out!
thanks
nHi!
The blog page works now. I just deselected the “Posts page:” on the Settings > Reading option page.
Regards,
PeterThanks!
Could you check the config of the WPML – it was very unstable
before I reinstalled a new version of the plugins, but I’m not sure
it’s set right. I am seeing a problem on the News / Nyheder pages
which do not link correctly in the language switcher. Keeps defaulting
to the landing. also, if you try to go to Nyheder from this page:
http://www.copenhagenfilmcompany.dk/2014/portfolio-item-da/mexico-express-2/?lang=da
it gets a 404 error on a different site directory. ???
thank you for your help!
you have a login, yes?
nyes – I am working on the WPML setup and had to take down the pages I had
done before. I will let you know if I am still having problems with that. thanks!
- The topic ‘icon box styling’ is closed to new replies.