- This topic is empty.
-
AuthorPosts
-
July 28, 2014 at 10:16 pm #176730dev0x0Participant
Hi,
I’m new to Botstrap 3.But i could manage some of the things.Now i’m facing a small issue.I have a large background image.I made it to responsive by using “img-responsive” class.Now i want to put my small image top of the background image.So then both images should be responsive.I searched the internet before posting this here.I tried with some of those soulutions.But still no luck.One thing i was done is wrote a css class for background image and made it’s position to absolute.After that wrote another class for small image and made it’s position to relative.At that point i got the small image over the big image.But it’s left aligned.I want it to be right aligned.Although now small image has placed over the big one small image isn’t responsive although i have made it to responsive by using “img-responsive” class.Please help me…
July 29, 2014 at 4:28 am #176746Paulie_DMemberWe can’t do anything with just a description of the problem.
I suggest you make a minimal example using either Codepen.io or Bootply.com and show us the problem.
July 29, 2014 at 6:01 am #176752dev0x0ParticipantThanks for your comment.Here is the link for the code.
http://codepen.io/anon/pen/kKGuJ
But i dunno it’s not responsive on the above file hosting server.So sorry for that.Because i’m not familiar with Codepen.io.
July 29, 2014 at 7:45 am #176781Krish1980ParticipantIs there a reason why you’d want an icon image to be responsive? An icon is already quite small to begin with – defining it in percentages would make it almost microscopic as the page re sizes.
A better way would be to use the appropriate sized icons, and only change its dimensions, using media queries at a break-point where it appears too large.
In any case, applying an ‘img-responsive class’ won’t work if you define the width and height inline, as you’ve done for your icon.
Here’s a codepen (I’ve used the same images that you’ve used, but ideally, I’d go for a smaller icon image or an svg)
http://codepen.io/Krish1980/pen/AjIms
But i dunno it’s not responsive on the above file hosting server
There’s a flower shaped icon beside the word Css which, when clicked, reveals a dropdown where you can attach external files (I’ve mentioned Bootstrap’s CDN path)
July 29, 2014 at 7:50 am #176785Paulie_DMemberThere’s a flower shaped icon beside the word Css
<chuckle>…it’s a ‘cog’
July 29, 2014 at 8:43 am #176798dev0x0ParticipantThanks all for the comments.And please can explain me what is bootstrap “clearfix” css class exatcly does?
July 29, 2014 at 9:27 am #176804Paulie_DMemberIt clears floats.
I’m sure you can google
clearfix
it’ll provide you with a whole range of explanations.July 29, 2014 at 6:25 pm #176854dev0x0Participantok.thanks
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.