Forum Replies Created
-
Posts
-
Hi.
To make the flex_column smaller on mobile in portrait mode, i changed to this in chrome Devtools:
@media only screen and (max-width: 767px)
.responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
margin: 0;
margin-bottom: 20px;
width: 50%;
padding-right: 10px;
}
It works perfect, but when i put in enfold quick css, it has no effect!Thanks,
OPVABHi again.
If you look again at the Private Content , you’ll see the three columns. What I have problem with is that the flex_column av_one_thir have the right width,
but the “product type-product…” has much lower width and therefore get to low max-width. How could I synchronize that?Thanks,
OPV ABHi Rikard.
Well, everything! I can’t figure out how https://docs.woocommerce.com/wp-content/uploads/2017/10/shortcode-sale.png is configured the way it is.
I have tried the Product list and the Product grid, but can’t get it to act and look as above screen shot.If I instead use the Enfolds columns and insert “[product id=”2250″]”, I get the three columns, but the look is awful. See PC.
Thanks,
OPVABHi.
if some have the interest of a hover-effect without having to use Javascript or Plugins:
.custom-grid .av_textblock_section p {
/*display: none !important;*/
height: 0px;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: 1s;
-o-transition: 1s;
transition: 1s;
}.custom-grid .flex_cell_inner:hover .av_textblock_section p {
/*display: block !important;*/
height: 50px;
opacity: 1;
filter: alpha(opacity=100);
}/
OPVABIs JavaScript really required. Must be possible to do with only CCS.
Below CCS makes it slide nice:
animation: slide-top 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s 1 normal both running;
}Must be a way to use similar CCS for my hover-effect.Thanks,
OPVABHi.
As it is now, I have three elements on the 1/3 column. I only want to have one element, the image element with the Caption text.
But I want some of the “on-hover” caption to be visable from start, like: https://www.jordancrown.com/portfolio/.New URL and existing CCS in PC.
Thanks,
OPVABHi again.
But saw now an issue with the code. The logo disappears also from smartphones, and there would I like it to be visable.Is it possible to control that with some @media only screen-code?
//OPVAB
Hi and thanks for all the effort.
Your CSS works superfine for 1920px wide screen, but when watching with differtent screen resolution or on Ipad,
the color-overlay no longer follow the container.I don’t know if it is possible for the color-overlay to be responsive and always centered as the .container
who probably pick up responsive code from bootstrap framework, but it would be great if it could be solved.Thanks,
OPVABHi.
min-width: 100% is going to stretch the color-overlay full width.
I want the color-overlay to act like main container, such as:
.responsive .container {
max-width: 1310px;
}/
OPVABHi.
This works if your are on a 1920 screen and don’t care about responsive:
.av-section-color-overlay {
max-width: 1310px;
position: relative;
}
div .av-section-color-overlay {
top: 0;
left: 297px;
height: 100%;
width: 100%;
}
But realy need a css that wraps the overlay accordingly the container./
OPVABHi.
You’ll find url & printscreen in PC.
I have on the section #meny:
– Color section with one full screen stretch bg image
– Section Overlay bg, #FFFFFF 0.5
– Column layer elements.Dont’t want any bg color on Column elements, but instead let the Section overlay color stretch to my site maximum container width.
Thanks,
OPVABHi and thanks.
Did not work unfortunately. I tried to modify to different modes, but Iphone 5S and Iphone 6S still behave differently.
Feels like the models don’t listen to any “@media only screen” and use this:
main.template-page.content.av-content-full.alpha.units {
right: -100px;
,right off.Printscreen from Iphone 5S in PC.
Thanks,
OPVABHi Rikard,
for some reason, the S-models of Iphone doesn’t aquire the Media Query but instead use the Monitor CSS:
main.template-page.content.av-content-full.alpha.units {
right: -100px;
}I can’t understand why the Iphone S-models behave differently from the rest!!!!
Anybody who could help me find a @media only screen CSS, that pick up the S-models, so they don’t use the “right: -100px”OPVAB
Hi Rikard,
Yes. All content is nicely centered on Iphone, except for models 5s and 6s.
Thanks,
OPVABThanks Andy, now looking to work just fine. With all my quick css, I can’t regulate page content by align values. The get on different sides on Iphobe for instance. If I want to use three 1/3 layout modules on a row, but thinks there is to much gap between col, could I alter this:
#top .no_margin.av_one_third {
width: 33%;
}to this:
#top .no_margin.av_one_third {
width: 25%;
}Thanks,
OPV ABHi Andy.
Main focus is to get the main container, logo area & menu area, move to the right without strange wrap issues. I have postad URL in earlier message,I’ll do it again.
Thanks,
OPVABHi Andy.
I’m not familiar with boxed style. But I’ve noticed that this one: #top .flex_column_table: Width 100% is causing problems when tying to move everything to the right. It makes page content very “spread out”.
I’m attaching my quick css.
Thanks,
OPVABHi Andy.
I’ve struggled enough now, so maybe you could help me. I want a site where the main content frame is aligned to the right (please see Private Content Image). But I also get the content aligned/margin right, and it just don’t work as a responsive site.
Thanks,
OPVABSorry, found the answer my self in your superb forum:
#top #main,#top .html_stretched #wrap_all,#top .alternate_color,#top .header_color,#top .main_color,#top .header_color div,#top #header,#top .header_color .container_wrap_meta,#top .header_color .header_bg,#top .footer_color,#top .footer_color,#top .socket_color {
background-color:rgba(255,255,255,0) !important;
}
#top .container_wrap {
border-top-width:0px !important;
}
#top #header_main {
border-bottom-width: 0px !important;
}NEW QUESTION: Is there a way to have logo center above the menu, like this.
https://home.opv.se/wp-content/uploads/2016/09/print-screen.pngThanks,
Ted CalmiusThanks a lot, worked lika a charm. Imagine if there could be a way to have unique codes to certain *.php, like your custom css. None of my *.php is original anymore, and with every WP or theme update, I have a lot of work to do!!!
Thanks,
OPVAB
