- This topic is empty.
-
AuthorPosts
-
November 18, 2016 at 6:56 am #247990
Ayala
ParticipantHi,
I want to put this two buttons next to the images.
But the images must be position: relative, because they should be on each other.Any idea?
November 18, 2016 at 10:45 am #248014Paulie_D
MemberIt’s not clear what you are trying to do.
I’m guessing that this is some kind of slideshow.
You indicate that the “images” should be
position:relative
but they aren’t in your code.Also, your “buttons” div is using both absolute positioning AND
float
which is just not logical.November 18, 2016 at 1:19 pm #248016Shikkediel
ParticipantFrom what I understand (after looking twice), I think it would come down to this:
Assuming
relative
positioning for the images is a misunderstanding andabsolute
was meant. Which will give the issue of not being able to position the buttons to the right of the slider because it then has no width (or height). But not all the images need to be absolutely positioned, I think. Leave the first one relative and the slider will have outer dimensions to adapt the position of the buttons to.Edit – I suppose the images will get a
z-index
assigned as some point, otherwise the first image doesn’t even need any positioning at all.November 21, 2016 at 1:32 am #248053Ayala
ParticipantThank you for the answers.
I am sorry I wasn’t clear enough.
But you understood what I wanted:)Yes, actually this is an absoulte-problem, not relative.
Yes, Shikkediel, I wanted this. The only thing I don’t understand is why the .buttons has 40px padding-left. This isn’t in your code. I would like no space between the images and the buttons.
November 21, 2016 at 2:04 am #248054Shikkediel
ParticipantThose look like browser default values, I usually do a reset at the start:
* { padding: 0; margin: 0; }
But it’ll also work on the
ul
element alone of course.November 21, 2016 at 2:26 am #248055Ayala
ParticipantThank you!
November 21, 2016 at 2:40 am #248056Ayala
ParticipantThe height of slider is bigger by 4,5 pixels that the image. Why?
November 21, 2016 at 3:05 am #248057Shikkediel
ParticipantInline elements inside a block level element will add an empty line. Or something like that, there’s probably a better description. Anyway, you can use this to get rid of it (giving absolute position already adds it automatically for the others):
.image:first-of-type { position: relative; display: block; }
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.