Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • March 31, 2015 at 2:40 pm #421138
    mleite1

    Hello, I need to change the position of the button and characteristics. This button is under an image that signed up in the easy slider fullwidth. I used the quick css this code below but it did not work.

    .avia-button {
      border-radius: 3px;
      padding: 10px;
      font-size: 12px;
      text-decoration: none;
      display: inline-block;
      border-bottom-style: solid;
      border-bottom-width: 1px;
      margin: 395px -390px;
      line-height: 1.2em;
      position: relative;
      font-weight: normal;
      text-align: center;
      max-width: 100%;
    }

    What is missing?

    link image
    https://www.dropbox.com/s/wn7vbg05ao94u5z/buton.png?dl=0

    March 31, 2015 at 11:37 pm #421656
    Josue

    Hey!

    What do you want to change exactly? also, please post a link to the site.

    Best regards,
    Josue

    April 1, 2015 at 3:08 am #421692
    mleite1

    Josue, this is a problem on the site below.

    IPhone 6 on the same button is huge on the screen.

    http://quintadaslagoas.com.br/20152/

    I want to relocate this button. I want to control this position.

    April 1, 2015 at 6:01 am #421751
    Josue

    Ok, use the following CSS code:

    @media only screen and (max-width: 767px) {
#full_slider_1 .avia-slideshow-button {    
    position: absolute;

    /* Adjust these for position */
    top: -20px;
    left: 60px;

    /* Adjust this for size */
    padding: 3px !important;
    font-size: 12px !important;
}
}
    • This reply was modified 9 years, 7 months ago by Josue.
    April 1, 2015 at 9:36 am #421802
    mleite1

    Josue, copied and pasted your code in quick css and nothing happened. I changed the font size, top position and left and nothing has changed.

    The margin that takes to the button:
    body div. avaia-button
    margin: 327px -370px;

    And opacity and size
    #top .avia-slideshow-button.avia-color-light {
    . Padding: 10px 14px;
    . Background-color: RGBA (0,0,0,0.6);
    }

    Your code should be controlling some other function.

    April 1, 2015 at 3:10 pm #421932
    Yigit

    Hey!

    Can you please post the content of your Quick CSS field using pastebin.com?
    Your code should be as following

    #top .avia-slideshow-button.avia-color-light {
padding: 10px 14px;
background-color: RGBA (0,0,0,0.6);
}

    Best regards,
    Yigit

    April 1, 2015 at 4:02 pm #421979
    mleite1

    This pastebin.com, is to see errors in the code?

    The code you sent me just change the property of the button. I need to change it in place. He is over the image. I want him to go to the upper left corner of the screen. Have to move on xxpx margin, xxpx.

    The opacity of your code does not work.

    April 1, 2015 at 9:36 pm #422171
    Josue

    Hey!

    I wrapped it with a media query because i thought you wanted this mod only on mobile, try putting the code like this:

    #full_slider_1 .avia-slideshow-button {    
    position: absolute;

    /* Adjust these for position */
    top: -20px;
    left: 60px;

    /* Adjust this for size */
    padding: 3px !important;
    font-size: 12px !important;
}

    Regards,
    Josue

    April 2, 2015 at 2:27 am #422242
    mleite1

    Josue, Thank you very much.

    But I noticed a problem. The button does not appear on the screen of my Macbook Air 13 “. But in the Macbook Pro 17” appears the button. Why does this happen?

    http://quintadaslagoas.com.br/20152/

    Screen Macbook 13 “- http://www.screencast.com/t/8Bz5VSHYy

    April 2, 2015 at 9:34 am #422357
    Josue

    Hey!

    Use another left value and/or merge it with media queries so you can control the position of the button in a range of screen sizes:

    @media only screen and (max-width: 767px) {
	#full_slider_1 .avia-slideshow-button {    
	    top: 24px;
	    left: 200px;
	}
}
@media only screen and (max-width: 1200px) {
	#full_slider_1 .avia-slideshow-button {    
	    top: 24px;
	    left: 200px;
	}
}
@media only screen and (max-width: 1400px) {
	#full_slider_1 .avia-slideshow-button {    
	    top: 24px;
	    left: 200px;
	}
}

    Cheers!
    Josue

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.