- This topic is empty.
-
AuthorPosts
-
November 9, 2015 at 12:18 pm #234739mikelfParticipant
Hello, i got the following elements: http://i.imgur.com/IFBIFeL.png
i want to change the “ay” div on the right, so the image and the text would be inline.
if i set both divs to float:left; the text goes messy and it pretty much breaks all the aspectNovember 9, 2015 at 12:19 pm #234740mikelfParticipantedit: also, how can i make the text be inline after the icons?
eg:
http://i.imgur.com/kDQd09X.pngit currently is something like:
http://i.imgur.com/3cmQ5VJ.pngNovember 9, 2015 at 12:37 pm #234741BeverleyhParticipantThere isn’t much for us to work with – the image bears no resemblance to the CodePen demo. You need to make it easier for us to help you.
Try putting in some HTML markup to illustrate the outlined box on the left and list of icons/text on the right.
Also include enough CSS to recreate/mockup the image layout.
The JS isn’t doing anything here so try extracting the outputted markup and put it into the appropriate place in the HTML pane instead.
if i set both divs to float:left;
Both divs? There’s only one in your CodePen.
the text goes messy and it pretty much breaks all the aspect
You should recreate this problem for us in the demo, otherwise we can’t help (we cant guess at what “goes messy” or “breaks all the aspect” means )
November 10, 2015 at 10:57 am #234776mikelfParticipantregarding the text issue:
http://i.imgur.com/HU6plvu.pngEdited by Admin – Please use codepen for code :)
http://codepen.io/anon/pen/jbQYZwIcons have different width and the text dont start at the same point
November 10, 2015 at 11:08 am #234777BeverleyhParticipantPut a min-width on the icons?
If you need further help, please put the pertinent markup and CSS into your CodePen
November 10, 2015 at 1:41 pm #234779bearheadParticipantYeah it seems like you’re getting that because the icons are all different sizes.
So if that is the case, you can either give them a min-width like Beverley suggested, or just give them a set width.
It’s kind of hard to give more detailed advise than that without seeing a demo… I realize that you may be working with a CMS and the PHP scripts won’t execute in codepen. However, you can just create a static version for us to look at. It doesn’t sound like your problem is with PHP anyway.
November 10, 2015 at 1:48 pm #234780Alex ZaworskiParticipantYou could also stick them all in a container that has a fixed width, with the icons centered in the container (if you don’t want to change the icon sizes at all).
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.