Skip to main content
stephenm14622013
Known Participant
Jul 29, 2020 6:37 PM UTC
Answered

Button (component) padding & width questions

Short version: If you set a button (component) in a Master Doc to have horizontally padding. Is it possible to overwrite this on individual instances of the component?

 

If not, I guess I'll just need to have a button (component) without any horizontal padding and just change the width manually on each instance to get the desired affect. I know I could have one component with 30px horizontal padding, another with 60px and another without padding which can be scaled to 100% but this seems a bit OTT and difficult to manage for x3 very similar buttons?

 

As an aside to the above, is it possible to to change how the button component is aligned (left/centred/right) when resized/padding is changed? I noticed when I changed a button's padding it jumped to the right of the prototype when I thought it would align to the left edge when the size changed?

 

Finally, if you change the width of a component and it has various states. You need to update the width on every single state - is that correct? It's a bit of a pain to size a button and then when you hover over it, the width increase to the origin size in the Cloud (master) doc. This seems to be the case ...but I just wanted to check I'm not missing something!

Thanks in advance!

This topic is closed to new replies. Start a new post to keep the conversation going.
Dan Rodney
Dan RodneyCorrect answer
Community Expert
Aug 3, 2020 3:19 AM UTC

OK. I thought by resizing you meant to change the width, not the padding. You can change/remove padding in each instance, so you could have a default button padding, which you can change on each instance.

Adobe Certified Expert & Instructor at Noble Desktop | Web Developer, Designer, InDesign Scriptor
View reply

3 replies

Dan Rodney
Community Expert
Dan RodneyCommunity Expert
Community Expert
Jul 30, 2020 6:33 AM UTC

Is it possible to overwrite this on individual instances of the component?

Yes, you can resize it.

 

Finally, if you change the width of a component and it has various states. You need to update the width on every single state - is that correct?

Yes, as far as I know.

Translate
Adobe Certified Expert & Instructor at Noble Desktop | Web Developer, Designer, InDesign Scriptor
stephenm14622013Author
Known Participant
Jul 30, 2020 9:58 AM UTC

Thanks Dan!

 

When I said resize, I meant if I had a component with (for example) 60px horizontal padding set in the Master Doc. Then I drag that onto an Artboard in another XD. I don't think I can remove the padding at all? It has to keep the padding specified in the Master Doc - unless I'm missing something I can't see a way to turn off padding/stretch the element.

 

Seems like I may be better no setting padding in the Master Doc and padding it instance by instance in the child documents? Doesn't seem ideal but I have so many different variations I think I might need to do this just for flexibility.

 

Otherwise I'll have a black button with several variants for size, padding, flexible width - which I think will make the Assets panel more difficult to follow / it's a bit OTT?

Translate
Dan Rodney
Community Expert
Dan RodneyCommunity ExpertCorrect answer
Community Expert
Aug 3, 2020 3:19 AM UTC

OK. I thought by resizing you meant to change the width, not the padding. You can change/remove padding in each instance, so you could have a default button padding, which you can change on each instance.

Translate
Adobe Certified Expert & Instructor at Noble Desktop | Web Developer, Designer, InDesign Scriptor
Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices